* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-size: 16px;
  font-family: "Inter", sans-serif;
  list-style: none;

}



/* color  */
:root {
  --primary-one: #F5AF24;
  --gray-one: #3D3D3D;
  --gray-two: #6B6B6B;
  --gray-three: #F5F7FA;
  --gray-four: #3E3E3E;
  --gray-five: #696969;
  --gray-six: #C9C9C9;
  --gray-seven: #D9D9D9;
  --navy-one: #030731;
  --bg-one: #F6F6F8;
  --black-one: "#222429";
  --gold-gradient: linear-gradient(90deg, #F5AF24 0%, #9F6C05 100%);
  --select-bg: #CDD4FB;
  --black-two: #020202;
}





/* Font family  */
/* Light - 300 */
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter18pt-Light.woff2") format("woff2");
  font-weight: 300;
  font-style: normal;
  font-display: swap;
}

/* Regular - 400 */
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter18pt-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

/* Medium - 500 */
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter18pt-Medium.woff2") format("woff2");
  font-weight: 500;
  font-style: normal;
  font-display: swap;
}

/* SemiBold - 600 */
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter18pt-SemiBold.woff2") format("woff2");
  font-weight: 600;
  font-style: normal;
  font-display: swap;
}

/* Bold - 700 */
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter18pt-Bold.woff2") format("woff2");
  font-weight: 700;
  font-style: normal;
  font-display: swap;
}

/* italic font  */
@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter18pt-Bold.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

@font-face {
  font-family: "Inter";
  src: url("../fonts/Inter18pt-Italic.woff2") format("woff2");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}


/* For italic usesage */
.inter_italic {
  font-style: italic;
}

/* Link styling  */
a {
  color: inherit !important;
  text-decoration: none !important;
}

a:hover {
  /* color: var(--primary-one) !important; */
  color: #ffba03 !important;
  cursor: pointer;
}

.school-explore-link {
  transition: all 0.3s ease;
}

.school-explore-link:hover {
  color: white !important;;
  background-color: #ffba03; /* or any color you prefer */
}



/*--------------- Common styling of input box ----------------  */
.input_box {
  margin-bottom: 0.5rem;
}

.input_box input {
  cursor: pointer;
  /* background-color: var(--gray-three); */
  background-color: #cbd0d8;
  border: 1px solid transparent;
  width: 100%;
  border-radius: 0.3rem;
  padding: 0.5rem 1rem;

}

.input_box>label {
  display: flex;
  /* color: var(--primary-one); */
  padding-block: 0.5rem;
  padding-top: 1rem;
}

.input_box>label>span {
  margin-inline: 0.2rem;
}

.input_box input:focus {
  border: 1px solid var(--primary-one);
  outline: none;
  background-color: transparent;

}

.input_box input::placeholder {
  font-size: 15px;
}

.custom-checkbox {
  accent-color: var(--primary-one);
  width: 15px;
  height: 15px;
  cursor: pointer;
}

.label_icon img {
  width: 20px;
  height: 20px;
}

/* password eye  */
.pass_eye svg {
  position: absolute;
  top: 50%;
  /* center vertically */
  transform: translateY(-50%);
  right: 12px;
  width: 20px;
  height: 20px;
  cursor: pointer;
}

input::-ms-reveal,
input::-ms-clear {
  display: none;
}

.input_box:focus-within label {
  color: var(--primary-one);
}

.input_box:focus-within label svg {
  color: var(--primary-one);
}

textarea {
  width: 100%;
  background-color: var(--gray-three);
  outline: none;
  border: none;
  padding: 1rem;
  border-radius: 0.5rem;
  cursor: pointer;
}

textarea:focus {
  background-color: transparent;
}

.input_box .input_relative_box {
  position: relative;
}

/* ------------------ Custom Dropdowns select styling Don't changes Existing --------------------------- */
.custom-select {
  position: relative;
  /* min-width: 150px; */
  /* margin: 16px 0; */
}

.select-selected {
  padding: 10px 5px;
  cursor: pointer;
  user-select: none;
  display: flex;
  /* justify-content: space-between; */
  align-items: center;
  gap: 1.5rem;
}

.select-arrow {
  font-size: 12px;

}

.select-items {
  position: absolute;
  left: 0;
  right: 0;
  border-top: none;
  z-index: 100;
  max-height: 200px;
  overflow: auto;
  border-radius: 0.5rem;
  border: 2px solid #ffba03;
  background-color: #1a1a3e;
}

.select-items {
  position: absolute;
  left: 0;
  right: 0;
  border-top: none;
  z-index: 100;
  max-height: 200px;
  overflow: auto;

  /* Entire dropdown glass effect */
  /* backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px); */
  border-radius: 0.5rem;
  border: 2px solid #ffba03;
  background-color: #1a1a3e;
}

/* option rows */
.select-items>div {
  padding: 9px 12px;
  cursor: pointer;
  border-radius: 6px;
  /* smooth hover corners */
}

/* glass hover in primary color */
.select-items>div:hover {
  background: var(--primary-one);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}

.hidden {
  display: none !important;
}




/* ------------- Changing styles of select dropdown into Hero section ---------------  */

.hero_section_selects .custom-select {
  background-color: var(--select-bg);
  padding: 0.2rem 0.5rem;
  border-radius: 0.5rem;
  color: black;
  margin: 0.6rem 0;
}

.hero_section_selects .select-selected {
  justify-content: space-between;
}

.hero_section_selects .select-items {
  position: absolute;
  margin-top: 0.5rem;
  left: 0;
  right: 0;
  border-top: none;
  z-index: 100;
  max-height: 200px;
  overflow: auto;
  background: var(--select-bg);
  border-radius: 0.5rem;

}

.hero_section_selects .select-items>div {
  padding: 9px 12px;
  cursor: pointer;
  border-radius: 6px;
}

.hero_section_selects .select-items>div:hover {
  background: var(--primary-one);
  /* glassy hover */
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
}







/* -------------- Main Header -------------------- */

.header_main {
  color: white;
  padding: 1rem 0;
  border-bottom: 1px solid #FFFFFF4D;
}


.nav-logo {
  width: 150px;
  height: 100%;
}

.nav_main {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.nav_list {
  display: none;
}

.nav_list ul {
  display: flex;
  align-items: center;
  gap: 4rem;

}


.nav_list ul li:hover {
  cursor: pointer;
}


/* ---------------- Login + signup page styling ---------------- */

.login_pg_container {
  min-height: 100vh;
  /* width: 100vw; */
  display: flex;
  align-items: center;
  justify-content: center;
  background-image: url(../Images/login-bg.png);
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;
  padding: 1rem 0.5rem;
}

.login_pg_container .login_container_main {
  border-radius: 1rem;
  overflow: hidden;
  background-color: #FFFFFF;
}

.login_pg_container .login_container_main .login_banner_container {
  background-image: url(../Images/login-left.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  height: 100%;
  padding: 1.5rem;
  display: flex;
  flex-direction: column;
  gap: 4rem;
  color: #FFFFFF;
  /* padding-bottom: 4rem; */
  font-size: 1rem;
  position: relative;
}

.login_pg_container .login_container_main .login_banner_container .login_welcome_lines {
  padding-left: 0.6rem;
  /* position: absolute; */
  /* top: 45%; */
  /* transform: translateX(-50%); */
}

.login_pg_container .login_container_main .login_banner_container .login_welcome_lines>h2 {
  font-size: 45px;
  font-weight: 400;

}


.login_pg_container .login_container_main .login_banner_container .login_welcome_lines>h2 span {
  font-size: 45px;
  display: block;
  font-weight: 700;
  overflow-y: hidden;
}

.login_pg_container .login_container_main .login_banner_container .login_welcome_lines p {
  padding-top: 0.2rem;
}

.login_pg_container .login_container_main .login_form_container {
  padding: 2rem;
  background-color: #FFFFFF;
  font-size: 15px;

}

.login_pg_container .login_container_main .login_form_container .login_form_header {
  text-align: center;
  line-height: normal;
}

.login_form_header>h2 {
  font-weight: 700;
  /* border: 1px solid black; */
  overflow-y: hidden;
}

.login_form_header>p {
  color: var(--gray-one);
}

.login_pg_container .login_container_main .login_form_container .remeber_column {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding-block: 0.8rem;
  color: var(--gray-one);
  font-weight: 500;
  cursor: pointer;
}

.remeber_column_main {
  display: flex;
  align-items: center;
  gap: 5px;
}

.remeber_column p {
  font-size: 15px;
}


.login_pg_container .login_container_main .login_form_container .login_form_footer {
  padding-block: 0.8rem;
  text-align: center;
}

.btn-one-gradiant {
  width: 100%;
  color: #FFFFFF;
  background: var(--gold-gradient);
  border-radius: 0.2rem;
  border: none;
  padding: 0.5rem;
  font-weight: 500;
  font-size: 1.1rem;
}

.login_pg_container .login_container_main .login_form_container .login_form_footer>p {
  padding-block: 1rem;
  color: var(--gray-four);
}

.login_pg_container .login_container_main .login_form_container .login_form_footer>p span {
  font-weight: 500;
  cursor: pointer;

}

/* ------------- Page top header -------------- */

.top_header_main>ul {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.4rem;
  flex-wrap: wrap;
  /* border: 1px solid white; */
  text-align: center;
  line-height: normal;
}

.top_header_main>ul :first-child {
  display: none;
}

.top_header_main ul li:nth-child(2) {
  color: var(--primary-one);
  font-style: italic;
}

.top_header_main ul li:nth-child(3) {
  display: none;
}

.top_header_main ul li:nth-child(3) button {
  border: none;
  background-color: transparent;
  padding: 0 1rem;

}

/* ---- contact us page hero section banner --------- */

.top_contact_banner {
  background-image: url(../Images/contact-bg.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

}

.top_main_banner {
  background-image: url(../Images/contact-bg.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;

}


/* ----------------- Contact us Hero section banner styling ---------------------- */

.top_pg_banner {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 50vh;
}

.top-pg-banner-txt h2 {
  color: var(--primary-one);
  font-weight: 600;
  font-size: 2rem;
}

.top-pg-banner-txt p {
  color: white;
  font-size: 15px;
}



/* ----------------- Contact us Form section styling ---------------- */

.contact_main_heading>h2 {
  color: var(--navy-one);
  text-align: center;

}

.contact_main_heading>p {
  color: var(--gray-two);
  text-align: center;
  margin-inline: auto;
  max-width: 65%;

}

.contact_form_main {
  padding: 1.5rem 0.5rem;
}

.heading_bottom {
  border: 2px solid var(--primary-one);
  max-width: 60px;

}

.border_heading {
  margin-inline: auto;
  max-width: fit-content;
}





.contact_form_main_wrapper {
  border-radius: 1rem 0.5rem;
  box-shadow: 0px 0px 60px 30px #00000008;
  padding: 1rem;
  background-color: white;

}

.contact_form_left {
  height: 100%;
  padding: 1.5rem 1rem;
  border-radius: 1rem;
  background-color: var(--navy-one);
  color: white;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  position: relative;
}

.small-circle {
  position: absolute;
  bottom: 12%;
  right: 18%;
}

.big-circle {
  position: absolute;
  right: 0;
  bottom: 0;
}


.contact_form_lf_head {
  font-weight: 300;
}

.contact_form_lf_head p {
  color: var(--gray-six);
}

.contact_form_lf_middle ul {
  padding: 0;
}

.contact_form_lf_middle ul li {
  margin-block: 1rem;
  display: flex;
}

.contact_form_lf_middle ul li span {
  margin-right: 0.5rem;
  display: block;

}

.contact_form_lf_middle ul li span img {
  height: 25px;
  min-width: 25px;
}

.contact_form_lf_last ul {
  padding: 0;
  display: flex;
  align-items: center;
}

.contact_form_lf_last ul li {
  height: 40px;
  width: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  margin-inline: 0.3rem;
  background-color: var(--primary-one);
  cursor: pointer;
}

.contact_form_lf_last ul li:hover {
  background-color: transparent;
  border: 1px solid var(--primary-one);
  transition: all 0.3s ease-in-out;
}





/* ---------------- Contact us -> more address section ------------------- */

.more_address {
  /* border: 1px solid black; */
  background-color: var(--bg-one);
}

.address_card_main {
  border-radius: 0.5rem;
  margin: 1rem 0;
  background-color: #FFFFFF;
  padding: 1.5rem;
}

.address_card_main>p {
  font-weight: 600;
  color: var(--black-one);
  font-size: 20px;
}

.address_card_main ul {
  padding-left: 0;
}

.address_card_main ul li {
  display: flex;
  align-items: flex-start;
  gap: 1rem;
  margin: 1rem 0;
  color: var(--gray-five);
  font-size: 16px;
}


.address_card_main ul li span {
  background-color: var(--primary-one);
  border-radius: 0.5rem;
  padding: 0.5rem;
  min-width: 40px;
  min-height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;

}




/* -------------------- Footer --------------------  */
.footer_main {
  background-image: url(../Images/footer-bg-new.png);
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover;
  color: white;

}

.footer_main__ {
  padding: 1.5rem 0;
}

.footer_sub_main {
  /* border: 1px solid white; */
  padding: 0.5rem 0;
}

.footer_sub_main .footer_sub_main_ul {
  padding-left: 0;
}

.footer_sub_main .footer_sub_main_ul li {
  margin-block: 1rem;
}

.footer_social {
  display: flex;
  align-items: center;
  margin-bottom: 0;
}

.footer_social li {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 38px;
  width: 38px;
  background-color: var(--primary-one);
  margin: 0.2rem;
  border-radius: 50%;
}

.footer_social li img {
  height: 15px;
}

.footer_sub_head {
  margin-block: 1.5rem;
  margin-bottom: 1.5rem;
  font-weight: 500;
}

.footer_sub_main_ul li span img {
  margin-right: 0.5rem;
  height: 16px;
  width: 16px;

}

.footer_sub_main_ul li:hover {
  color: var(--primary-one);
  cursor: pointer;
}

.footer_list {
  padding-left: 1rem;

}

.copyright {
  border-top: 1px solid white;
  padding: 0.5rem;

}

.copyright span {
  color: var(--primary-one);
}

/* ------------------ Hero section styling ----------------------  */

.hero_section_main {
  padding: 1.5rem;
}

.hero_section {
  background-image: url(../Images/hero-bg.png);
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: white;
  padding-top: 0;
}


.hero_section_heading .hero_section_title {
  /* font-size: 3rem; */
  font-size: 2rem;
  font-weight: 600;
}

.hero_section_heading .hero_section_title span {
  color: var(--primary-one);
  font-size: inherit;
}

.hero_section_heading .hero_section_subtitle {
  font-size: 16px;
}



.hero_section_btn button {
  width: 100%;
  border: 1px solid var(--primary-one);
  color: var(--primary-one);
  background-color: transparent;
  padding: 0.6rem;
  border-radius: 0.5rem;
  font-weight: 500;
}

.hero_section_btn button:hover {
  background-color: var(--primary-one);
  color: white;
  transition: all 0.2s ease-in;
}

.hero_section_boy_img {
  /* padding: 1.5rem; */
  padding-bottom: 0;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;

}

.hero_section_boy_img img {
  width: 100%;
  max-height: 400px;
  object-fit: contain;
}




/* ----------------- How its work section ----------------------- */

.how_its_work_sec {
  padding: 3rem 0;
  padding-bottom: 1.5rem;
}

.how_its_work_img_main {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
}

.how_its_work_img_wrapper {
  border: 1px solid var(--primary-one);
  /* padding: 2rem; */
  border-radius: 50%;
  /* width: 530px; */
  /* height: 530px; */
  height: 300px;
  width: 300px;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;

}

.how_its_work_sub_wrapper {
  background-color: var(--primary-one);
  border-radius: 50%;
  /* width: 450px; */
  /* height: 450px; */
  height: 250px;
  width: 250px;

}

.how_its_work_img_wrapper:hover {
  border: 1px solid var(--navy-one);
  transition: all 0.3s ease;
}

.how_its_work_sub_wrapper:hover {
  background-color: var(--navy-one);
  transition: all 0.3s ease;
}

.how_its_work_boy {
  position: absolute;
  left: 0;
  bottom: 6.5%;
  /* height: 500px; */
  height: 280px;
  top: 46%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.how_its_abs_img {
  position: absolute;
}

.how_its_abs_img1 {
  /* top: 10%; */
  top: -3%;
  /* left: -5%; */
  left: -3%;
}

.how_its_abs_img2 {
  /* top: -8%; */
  top: -14%;
  right: 0%;
}

.how_its_abs_img3 {
  /* bottom: 0; */
  position: absolute;
  bottom: -10%;
  left: -6%;
}


.how_its_work_content_main {
  /* border: 1px solid black; */
  height: 100%;
  /* padding: 1rem; */
  padding: 2rem 0.5rem;

}

.how_its_work_ul {
  padding-left: 0;
}

.how_its_work_ul li {
  display: flex;
  align-items: center;
  gap: 1rem;
  color: var(--navy-one);
  font-weight: 500;
  margin-block: 0.8rem;

}

.how_its_work_ul li span {
  background-color: var(--primary-one);
  min-height: 25px;
  min-width: 25px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;

}










/* --------------- Book set section styling --------------------- */

.book_set_sec {
  background-color: var(--bg-one);
}

.book_set_card {
  padding: 1.5rem;
  background-color: #FFFFFF;
  box-shadow: 0px 20px 40px 0px #0000000D;
  border-radius: 0.5rem;
  padding-bottom: 0;
  margin: 1rem 0.5rem;

}

.book_set_card_img {
  border-top-right-radius: 0.5rem;
  border-top-left-radius: 0.5rem;
  overflow: hidden;
}

.book_set_card_content {
  padding: 1rem 0;
  color: var(--navy-one);
  font-weight: 500;
}

/* --------------- Testimonial + owl carasouel styling --------------------- */

.testimonial_card {
  border: 1px solid #0000001A;
  padding: 1.5rem;
  position: relative;
}

.testimonial_user {
  display: flex;
  width: 100%;
  align-items: center;
  gap: 1rem;

}

.user_img {
  max-height: fit-content;
}

.user_img img {
  width: 100%;
}


.user_review {
  width: 100%;
  line-height: normal;


}

.user_review ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 0;



}

.user_review ul .user_review_card ul {
  display: flex;
  padding-left: 0;
  padding-left: 0;
  gap: 0.3rem;
}

.user_review ul> :first-child {
  color: var(--black-one);
  font-weight: 600;
  font-size: 20px;
}

.user_review ul> :nth-child(2) {
  color: var(--gray-five);
  font-weight: 500;
}

.user_review_card {
  /* border: 1px solid black; */
  padding: 0.5rem 0;
}

.testimonial_content {
  padding: 1rem 0;
  color: var(--gray-five);
}

/* .testimonial_heading {
  border: 1px solid black;
} */
.testimonial-carousel-wrapper {
  position: relative;
}

.testimonial-carousel-wrapper {
  position: relative;
}

.owl-carousel .owl-stage-outer {
  z-index: 1;
  /* ↓ allows arrows to be clickable */
}

.testimonial-carousel-wrapper .owl-nav {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: absolute;
  width: 100%;
  top: 50%;
  z-index: 999;
}

.testimonial-carousel-wrapper .owl-next,
.testimonial-carousel-wrapper .owl-prev {
  display: flex;
  height: 25px;
  width: 25px;
  align-items: center;
  justify-content: center;
  border: 1px solid var(--gray-seven) !important;
  background-color: #fff !important;
  line-height: normal;


}

.testimonial-carousel-wrapper .owl-next span,
.testimonial-carousel-wrapper .owl-prev span {
  font-size: 20px;
  font-weight: 600;
  line-height: 100%;
  max-width: fit-content;
  margin-bottom: 0.2rem;

}

/* Move previous arrow (left) */
.testimonial-carousel-wrapper .owl-prev {

  /* or use transform */
  transform: translateX(-10px);
}

/* Move next arrow (right) */
.testimonial-carousel-wrapper .owl-next {

  /* or use transform */
  transform: translateX(10px);
}






/*------------------- offcanvas ---------------------  */

.offcanvas_btn {
  border: none;
  background-color: transparent;
}

.offcanvas_btn svg {
  width: 100%;
  height: 29px;
  color: white;
  font-weight: 600;
}

.offcanvas_main {
  background-color: var(--navy-one);
  color: white;
  padding: 0.5rem 0.2rem;

}

.offcanvas-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

.offcanvas_logo img {
  width: 100%;
  height: 40px;
}

.offcanvas_close {
  padding-right: 0.5rem;
}

.offcanvas_close img {
  height: 16px;
  width: 16px;

}

/* --------------- offcanvas dropdown ----------------------  */

.custom-dropdown {
  width: 200px;
  font-family: Arial;
}

.offcanvas_contact_ ul {
  padding-left: 0;
}

.offcanvas_contact_ ul li {
  border-bottom: 1px solid #fff;
  padding: 0.5rem;
}

.offcanvas_dropdown {
  display: flex;
  justify-content: space-between;
}

.offcanvas_dropdown_list {
  display: block;
}

.dropdown_menus {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.5s ease;
  border-radius: 6px;
  margin-left: 10px;
}

.dropdown_menus.show {
  max-height: 300px;
  /* enough height for list */
}

.offcanvas_dropdown {
  display: flex;
  justify-content: space-between;
  cursor: pointer;
  padding: 10px 5px;
}

.dropdown_menus ul {
  margin-bottom: 1.5rem;

}

.dropdown_menus ul li {
  border-bottom: none;
  color: var(--primary-one);
}



/* ------------- Common styling component --------------- */
.gurukul_center_heading {
  max-width: fit-content;
  margin: 0 auto;
  margin-bottom: 1rem;

}

.gurukul_center_p {
  text-align: center;
  /* padding: 0 22%; */
}

/* .gurukul_heading{
  border: 1px solid black;
} */
.gurukul_heading h2 {
  font-weight: 600;
  color: var(--navy-one);
  /* font-size: 2.5rem; */
  font-size: 2rem;
}

.gurukul_heading_txt {
  font-size: 1.1rem;
  margin-block: 1rem;
  /* padding-right: 3rem; */
  color: var(--gray-two);
}

.gurukul-sec-heading h2 {
  max-width: fit-content;
  font-weight: 600;
  font-size: 2rem;
  color: var(--black-one);

}

.gurukul-sec-heading p {
  /* max-width: 80%; */
  margin: 0 auto;
  margin-bottom: 1.5rem;
}

.gurukul-sec {
  padding: 3rem 0;
}

.gurukul-sec-heading {
  text-align: center;
}

.guru_sec_line_heading {
  max-width: fit-content;
  margin-inline: auto;
  margin-bottom: 0.5rem;
  /* border: 1px solid black; */

}

.guru-section {
  padding: 1.5rem 1rem;
}

.gurukul_sec {
  /* border: 1px solid black; */
  /* padding: 4.5rem 0; */
  padding: 3rem 0;
}





/* ------------------  Classes page UI Design  -----------------------  */
.top_class_pg_banner {
  background-image: url(../Images/school-book-set-banner.png);
  /* border: 1px solid red; */
}
.top_checkout_pg_banner{
  background-image: url(../Images/checkout-banner.png);
}

.bookset_content {
  /* border: 1px solid red; */
  padding: 2rem 0;

}

/* .breadcrumb_main {
  color: var(--gray-five);
  font-size: 15px;
  font-weight: 400;
  margin-bottom: 2rem;
} */

.breadcrumb_main {
    color: #3d3d38;
    font-size: 15px;
    font-weight: 400;
    margin-bottom: 2rem;
    background: #f5af24;
    padding: 10px;
}

.breadcrumb-hover-item:hover a {
  color: #e5e7eb !important; /* or any color you prefer */
}

.breadcrumb_main .breadcrumb_ul {
  display: flex;
  align-items: center;
  margin-bottom: 0;
  padding: 0;
  cursor: pointer;
}

.breadcrumb_main .breadcrumb_ul .breadcrumb_item:not(:first-child)::before {
  content: '';
  display: inline-block;
  width: 10px;
  /* set icon size */
  height: 10px;
  background-image: url('../Icons/breadcrumb-icon.svg');
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
  margin: 0 0.5rem;
  margin-left: 0.8rem;
  /* space before the breadcrumb text */
}


/* 
.sidebar_list_main {
  border: 1px solid black;
} */

.class_sidebar_header h5 {
  font-weight: 500;
  background-color: var(--primary-one);
  padding: 0.5rem 1rem;
  margin-bottom: 0;
}

.sidebar_list {
  padding-left: 0;
  padding: 0.5rem 0;
  /* background-color: var(--bg-one); */
  background-color: #f5af2426;
  color: var(--gray-five);
  font-size: 15px;
  border: 2px solid #f5af24;
}

.sidebar_item {
  padding: 0.4rem 1rem;
  cursor: pointer;
}

.sidebar_item:hover {
  background-color: #FFFFFF;
  box-shadow: 0px 4px 4px 0px #0000000D;
}

/* .selected_class_items_container{
  border: 1px solid black;
} */
.bookset_title{
  font-weight: 600;
  display: flex;
  align-items: center;
}
.bookset_title span{
  color: var(--gray-five);
  font-weight: 400;
  font-size: 16px;
  margin-inline: 1rem
  ;
}
/* .section_title{
  border: 1px solid black;
} */
.section_block{
  padding: 1rem 0;
} 
.section_block .section_header h3{
  margin-bottom: 0;
  font-weight: 600;
  padding: 0.5rem 0;
}


/* ------------------  Checkout Page Styles  -----------------------  */
.checkout_section {
  /* background-color: var(--bg-one); */
  background-color: #FFFFFF;
  padding: 3rem 0;
}

.checkout_heading h2 {
  color: var(--primary-one);
  font-weight: 700;
  margin-bottom: 2rem;
}

.checkout_card {
  /* background-color: #FFFFFF; */
  background-color: #F5F7FA;
  /* border-radius: 1.25rem; */
  padding: 2.5rem;
  box-shadow: 0px 35px 65px 0px #0000000A;
}

.checkout_block + .checkout_block {
  margin-top: 2rem;
}

.checkout_block_header h3 {
  margin-bottom: 1rem;
  font-weight: 600;
  color: var(--navy-one);
}

.checkout_form .row {
  row-gap: 1rem;
}

.checkout_form .input_box label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-weight: 500;
  color: var(--gray-one);
  padding-top: 0.5rem;
}

.checkout_form .label_icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--primary-one);
}

.checkout_form input,
.checkout_form select {
  background-color: #FFFFFF;
  border: 1px solid transparent;
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  width: 100%;
  font-size: 15px;
}

.checkout_form input:focus,
.checkout_form select:focus {
  border-color: var(--primary-one);
  background-color: transparent;
  outline: none;
}

/* Custom-select styling scoped only to checkout form */
.checkout_form .custom-select {
  width: 100%;
}

.checkout_form .select-selected {
  background-color: #FFFFFF;
  border: 1px solid transparent;
  border-radius: 0.5rem;
  padding: 0.75rem 1rem;
  font-size: 15px;
  width: 100%;
  color: var(--gray-one);
  justify-content: space-between;
}

.checkout_form .select-selected[data-placeholder="true"] {
  color: var(--gray-five);
}

.checkout_form .select-items {
  background-color: #FFFFFF;
  margin-top: 0.25rem;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.06);
}

.checkout_form .select-items > div {
  color: var(--gray-five);
}

.checkout_form select {
  appearance: none;
  -webkit-appearance: none;
  background-image: url('../Icons/dropdown-black.svg');
  background-repeat: no-repeat;
  background-position: right 1rem center;
  background-size: 14px;
}

.checkout_additional textarea {
  min-height: 140px;
  resize: none;
  border: 1px solid #D9D9D9;
  border-radius: 6px;
}

.checkout_summary {
  border-top: 1px solid #EFEFEF;
  margin-top: 2.5rem;
  padding-top: 1.5rem;
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1rem;
}

.checkout_total {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: 18px;
  color: var(--gray-one);
}

.checkout_amount {
  font-weight: 500;
  font-size: 16px;
  color: var(--black-two);
}

.checkout_btn {
  border: none;
  background: var(--primary-one);
  color: var(--navy-one);
  font-weight: 500;
  padding: 0.85rem 3.5rem;
  border-radius: 10px;
  width: fit-content;
  margin: 20px auto 0 !important;  /* center the button horizontally */
  display: inline-block;
}
.checkout_button_wrap {
  text-align: center;
  margin-top: 22px;
}

.checkout_btn:hover {
  opacity: 0.9;
}

/* ------------------  Bookset Table Styles  ----------------------- */

/* Table wrapper spacing + border style */
.bookset_table_wrapper {
  background: #fff;
  border: 1px solid #f5af24;
   
  /* border: 1px solid #E5E5E5; */
  /* border-radius: 6px; */
  /* padding: 0.5rem 0; */
  margin-bottom: 1.5rem;

}
.bookset_table{
  box-shadow: 0px 4px 4px 0px #0000000D;
}
.bookset_table_cart{
  border-bottom: 1px solid var(--select-bg);
}

/* Default table style */
.table_common {
    width: 100%;
    border-collapse: collapse;
}

/* Header */
.table_common thead {
    background-color: #f5af24 !important;
}

.table_common th {
    padding: 0.7rem 0.8rem;
    text-align: left;
    font-size: 16px;
    font-weight: 600;
    line-height: 100%;
    color: var(--gray-one);
    border-bottom: 1px solid #e6e6e6;
}

/* Body rows */
.table_common td {
    padding: 0.7rem 0.8rem;
    font-size: 14px;
    color: var(--gray-five);
    border-bottom: 1px solid #f2f2f2;
}

/* Row hover effect */
.table_common tbody tr:hover {
    background-color: #fafafa;
}

/* Remove last row border */
.table_common tr:last-child td {
    border-bottom: none;
}

/* ------------ Qty Box ------------ */

.qty_box {
  display: flex;
  align-items: center;
  border: 1px solid #f5af24;
  border-radius: 4px;
  overflow: hidden;
  width: fit-content;
  
}

 

.qty_minus:hover,
.qty_plus:hover {
    background: #ff9800;
    color: white;
    border-color: #ff9800;
}


.qty_btn {
  padding: 0.3rem 0.6rem;
  border: none;
  background: #fff;
  cursor: pointer;
  font-size: 16px;
  line-height: 1;
}

.qty_value {
  /* padding: 0 0.8rem; */
  font-size: 14px;
  color: #333;
  max-width: 48%;
  text-align:center;
}

/* Grand Total Bar */
.bookset_total_bar {
  background: var(--primary-one);       /* Primary-2 */
  padding: 12px 20px;
  display: flex;
  justify-content: flex-end;
  font-family: Avenir LT Pro;
  font-size: 18px;
  font-weight: 700;
  color: #000;               /* Text color as per screenshot */
  border-bottom-left-radius: 4px;
  border-bottom-right-radius: 4px;
}

.bookset_total_bar .total_right {
  font-weight: 900;
}

.total_right_group {
  display: flex;
  align-items: center;
  gap: 12px;             /* space between text and amount */
}


/* Shopping Cart Button */
.cart_button_wrapper {
  text-align: center;
  margin-top: 20px;
}

.cart_button {
  border: 2px solid var(--primary-one); /* Primary-2 */
  background: transparent;
  padding: 10px 26px;
  border-radius: 10px;
  font-family: Avenir LT Pro;
  font-size: 16px;
  font-weight: 700;
  color: var(--primary-one);            /* Button text color */
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.cart_button img {
  width: 20px;
  height: 20px;
}

.total_label {
  font-weight: 400;
  font-size: 20px;
  color: var(--black-two);
}

.total_amount {
  font-weight: 700;
  font-size: 20px;     /* heavier for numbers */
  color: var(--black-two);
}

.product_cell {
  display: flex;
  align-items: center;
  gap: 10px;
}

.product_icon {
  width: 40px;
  height: 40px;
  object-fit: contain;
}
/* Coupon section - equal width layout */
/*  coupon row */
.coupon_row_figma {
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 0 40px;      /* LEFT & RIGHT SPACE like Figma */
  gap: 10px;
}

/* Input width reduced */
.coupon_input {
  width: 45%;
}

.coupon_input input {
  width: 100%;
  padding: 14px 18px;
  border-radius: 12px;
  height: 50px;
  border: 1px solid var(--select-bg);
}

/* Button width reduced */
.coupon_btn_wrap {
  width: 45%;
}

 
/* Apply button perfect sync with input */
.apply_btn {
  width: 100%;
  height: 50px;
  line-height: 50px;       /* force vertical text center */
  border-radius: 12px;
  padding: 0;              /* remove extra padding */
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #F5AF24;
  border: none;
}

.cart_wrapper {
  border: 1px solid var(--select-bg);   /* light grey border */
  padding-top: 20px;               /* spacing from border */
}

.checkout_summary_cart {
  border-top: 1px solid var(--select-bg);
  margin: 1.5rem 0;
  padding: 1.5rem 1rem 0 0;  
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  gap: 1rem;
}


/* ------------- Classes / Bookset Responsive Tweaks ------------- */

/* Phones */
@media (max-width: 575.98px) {
  .bookset_content {
    padding: 1rem 0;
  }

  .breadcrumb_main {
    font-size: 12px;
    margin-bottom: 1.2rem;
  }

  .bookset_title {
    font-size: 1.1rem;
  }

  .bookset_title span {
    font-size: 0.85rem;
  }

  .sidebar_item {
    font-size: 14px;
    padding: 0.35rem 0.8rem;
  }

  .table_common th,
  .table_common td {
    padding: 0.5rem 0.6rem;
    font-size: 13px;
  }

  .qty_box {
    transform: scale(0.95);
  }

  .bookset_total_bar {
    padding: 10px 14px;
    font-size: 16px;
  }

  .total_label,
  .total_amount {
    font-size: 16px;
  }

  .cart_button {
    width: 100%;
    justify-content: center;
  }

  /* Breadcrumb mobile adjustments */
  /* .breadcrumb_main {
    font-size: 12px;
  } */

  .breadcrumb_main .breadcrumb_ul {
    flex-wrap: wrap;
    row-gap: 0.25rem;
  }

  .breadcrumb_main .breadcrumb_item {
    white-space: normal;
  }

  .checkout_card {
    padding: 1.5rem;
  }

  .checkout_summary {
    align-items: stretch;
  }

  /* Make Place Order button mobile-friendly */
  .checkout_section .checkout_button_wrap {
    padding: 0 1.25rem;
  }

  .checkout_section .checkout_btn {
    width: 100%;
    text-align: center;
    max-width: 100%;
  }
  .coupon_row_figma {
    flex-direction: column;
    padding: 0 1rem;
  }

  .coupon_input input,
  .apply_btn {
    height: 48px;
    
      font-size: 14px;     /* smaller text */
      padding: 0;          /* keep height clean */
    
  }

}


/* Tablets & below */
@media (max-width: 991.98px) {
  .bookset_content {
    padding: 1.5rem 0;
  }

  .book_selection_main .row {
    row-gap: 1.5rem;
  }

  .bookset_title {
    flex-direction: column;
    align-items: flex-start;
    gap: 0.25rem;
    font-size: 1.25rem;
  }

  .bookset_title span {
    margin-inline: 0;
    font-size: 0.9rem;
  }

  .sidebar_list_main.bookset_class_list {
    margin-bottom: 1rem;
  }

  /* Limit sidebar height on small screens and make it scrollable */
  .sidebar_list_main.bookset_class_list .sidebar_list {
    max-height: 320px;
    overflow-y: auto;
  }

  /* Make bookset tables scroll horizontally on smaller widths */
  .bookset_table_wrapper {
    overflow-x: auto;
  }

  .bookset_table_wrapper .table_common {
    min-width: 640px; /* keep columns readable */
  }
  .coupon_row_figma {
    padding: 0 1.5rem;
  }

}


@media (min-width: 576px) {

  /* .login_pg_container {
    min-height: 100vh;
  } */
  .header_main {
    color: white;

  }

  .nav-logo {
    width: 150px;
    height: 100%;
  }

  .top-pg-banner-txt h2 {
    color: var(--primary-one);
    font-weight: 600;
    font-size: 2.5rem;
  }

  .top-pg-banner-txt p {
    color: white;
  }

  .guru-section {
    padding: 2rem 1rem;
  }

  .gurukul-sec-heading p {
    /* max-width: 80%; */
    margin: 0 auto;
    margin-bottom: 2rem;
  }

  /* .contact_main_sec {
    border: 1px solid black;
    padding: 1rem;
  } */

  .gurukul-sec-heading h2 {
    max-width: fit-content;
    font-weight: 600;
    font-size: 2.5rem;

  }




  .contact_form_left {
    padding: 2rem;
  }



  .address_card_main {
    padding: 1rem auto;
  }



  .how_its_work_img_wrapper {
    height: 330px;
    width: 330px;
  }

  .how_its_work_sub_wrapper {
    height: 270px;
    width: 270px;
  }

  .how_its_work_boy {
    height: 300px;
  }

  .how_its_abs_img1 {
    left: -5%;
  }





}

@media (min-width: 768px) {
  .login_pg_container .login_container_main .login_banner_container {
    padding: 1.5rem 2.5rem;
    gap: 8rem;
  }

  .login_pg_container .login_container_main .login_form_container {
    padding-right: 2.5rem;
  }



  .login_pg_container .login_container_main .login_banner_container .login_welcome_lines {
    padding-left: 0.6rem;
    position: absolute;
    top: 45%;
    /* transform: translateX(-50%); */
  }

  .offcanvas_btn {
    display: none;
  }


  .nav_list {
    display: block;
  }

  .footer_sub_main {
    /* border: 1px solid white; */
    padding: 1.5rem 0;
  }

  .book_set_card {
    margin: 1rem 0;
  }

  .hero_section_heading .hero_section_title {
    font-size: 2rem;
  }

  .hero_section_boy_img img {
    max-height: 500px;
  }

  .how_its_work_sec {
    padding: 0;
  }

  .footer_list {
    padding: 0.5rem 1rem;
  }

  .contact_form_main {
    padding-right: 1rem;
  }

  .address_card_main {
    margin: 0;
  }

}

@media (min-width: 992px) {
  .login_pg_container .login_container_main .login_banner_container {
    padding: 3rem 2.5rem;
  }

  .login_pg_container .login_container_main {
    min-height: auto;
  }

  .login_pg_container .login_container_main .login_form_container {
    padding: 3rem 2.5rem;
    padding-right: 3.5rem;
  }

  .input_box input {
    color: var(--gray-one);
  }

  .top_header_main>ul {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0.4rem;
    flex-wrap: wrap;
  }

  .top_header_main>ul :first-child {
    display: flex;
  }

  .top_header_main ul li:nth-child(2) {
    color: var(--primary-one);
    font-style: italic;
  }

  .top_header_main ul li:nth-child(3) {
    display: flex;
    flex-wrap: nowrap;
    gap: 1rem;
  }



  /* Parent li */
  .auth-links {
    display: flex;
    align-items: center;
    gap: 10px;
  }

  /* Both links same style */
  .auth-links .auth-item {
    display: flex;
    align-items: center;
    gap: 10px;
    text-decoration: none;
    color: #000;
    cursor: pointer;
  }

  /* Divider */
  .auth-links .divider {
    color: #000;
    opacity: 0.6;
    font-weight: 500;
  }


  .login-btn {
    border-right: 1px solid black !important;

  }

  .hero_section_content {
    max-width: 90%;
  }

  .gurukul_center_p {
    padding: 0 22%;
  }

  .how_its_work_img_wrapper {
    height: 420px;
    width: 420px;

  }

  .how_its_work_sub_wrapper {
    height: 350px;
    width: 350px;
  }

  .how_its_work_boy {
    height: 390px;
    top: 46%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .how_its_abs_img2 {
    top: -10%;
  }

  .gurukul_sec {
    padding: 4.5rem 0;
  }

  .how_its_abs_img3 {
    bottom: 0;
  }

  .footer_list {
    padding: 0.5rem;
  }

  .guru-section {
    padding: 2.5rem;
  }

  .address_card_main {
    min-height: 100%;
  }

  .gurukul-sec-heading p {
    max-width: 80%;
  }

  .guru_sec_line_heading {
    margin-bottom: 1rem;
  }


}

@media (min-width:1200px) {
  .footer_social {
    margin-top: 1.5rem;
  }

  .hero_section_heading .hero_section_title {
    font-size: 3.1rem;
  }

  .how_its_work_img_wrapper {
    height: 480px;
    width: 480px;

  }

  .how_its_work_sub_wrapper {
    height: 400px;
    width: 400px;
  }

  .how_its_work_boy {
    height: 445px;
    top: 46%;
    left: 50%;
    transform: translate(-50%, -50%);
  }

  .how_its_abs_img2 {
    top: -10%;
  }

  .gurukul_sec {
    padding: 4.5rem 0;
  }

  .how_its_abs_img3 {
    bottom: 0;
  }

  .how_its_work_sec {
    padding: 3rem 0;
  }

  .guru-section {
    padding: 3.5rem;
  }

}

@media (min-width:1400px) {
  .hero_section_heading .hero_section_title {
    font-size: 3.5rem;
  }
}


/* for active in product display page */

.bookset_sidebar_item.active{
    /* background-color: #FFFFFF; */
    background-color: #f5af24;
    box-shadow: 0px 4px 4px 0px #0000000D;
    color: white;
}

.footer_sub_main_ul a,  .footer_sub_main_ul li{
  display:flex;
  align-items:center;
}

.bookset_table td:nth-child(6),
.bookset_table th:nth-child(6) {
    width: 150px !important;
    max-width: 150px;
}

.qty_box {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 5px;
}

.qty_box .qty_value {
    width: 45px !important;
    height: 32px;
    text-align: center;
}

.qty_box .qty_btn {
    width: 30px;
    height: 32px;
    /* line-height: 32px; */
    text-align: center;
}
