/* Helvetica Now Display */
@font-face{font-family: "HelveticaNowDisplay"; src: url("../fonts/HelveticaNowDisplay.otf") format("opentype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face{font-family: "HelveticaNowDisplay"; src: url("../fonts/HelveticaNowDisplayBold.otf") format("opentype"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face{font-family: "HelveticaNowDisplay"; src: url("../fonts/HelveticaNowDisplayLight.otf") format("opentype"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face{font-family: "HelveticaNowDisplay"; src: url("../fonts/HelveticaNowDisplayMedium.otf") format("opentype"); font-weight: 500; font-style: normal; font-display: swap; }
@font-face{font-family: "HelveticaNowDisplay"; src: url("../fonts/HelveticaNowDisplayThin.otf") format("opentype"); font-weight: 200; font-style: normal; font-display: swap; }
@font-face{font-family: "HelveticaNowDisplay"; src: url("../fonts/HelveticaNowDisplayBlack.otf") format("opentype"); font-weight: 900; font-style: normal; font-display: swap; }
/* Italic (agar files hain) */
@font-face{font-family: "HelveticaNowDisplay"; src: url("../fonts/HelveticaNowDisplayIt.otf") format("opentype"); font-weight: 400; font-style: italic; font-display: swap; }
/* The Seasons */
@font-face{font-family: "TheSeasons"; src: url("../fonts/The Seasons Regular.ttf") format("truetype"); font-weight: 400; font-style: normal; font-display: swap; }
@font-face{font-family: "TheSeasons"; src: url("../fonts/The Seasons Light.ttf") format("truetype"); font-weight: 300; font-style: normal; font-display: swap; }
@font-face{font-family: "TheSeasons"; src: url("../fonts/The Seasons Bold.ttf") format("truetype"); font-weight: 700; font-style: normal; font-display: swap; }
@font-face{font-family: "TheSeasons"; src: url("../fonts/The Seasons Italic.ttf") format("truetype"); font-weight: 400; font-style: italic; font-display: swap; }


*{margin: 0;padding: 0;box-sizing: border-box; scroll-behavior: smooth;}
html, body{ overflow-x: hidden; max-width: 100%;background-color: #F1F0E1; font-family: "HelveticaNowDisplay", Arial, sans-serif;}
li{list-style-type: none;font-family: "HelveticaNowDisplay", Arial, sans-serif;}
a{text-decoration: none; }
img{max-width: 100%; display: block;}
.container{max-width: 1350px; margin: 0 auto; padding: 0 10px; width: 100%;}
h1, h2, h3, h4, h5, h6{font-family: "TheSeasons", serif;}
span{font-family: "HelveticaNowDisplay", Arial, sans-serif;}

/* ===============================
        Banner Section CSS
   =============================== */
  .banner_section{padding: 50px; background: url(../images/banner_images.webp) no-repeat center center; background-size: cover; height: 100vh; }
  .banner_top a {display: flex; justify-content: end; align-items: center; }
  .banner_bottom {display: flex; padding-top: 100px; }
  .banner_left {width: 50%; }
  .banner_right {width: 50%; }
  .banner_right h2 {font-family: "HelveticaNowDisplay", Arial, sans-serif; font-weight: 325; font-style: Light; font-size: 30px; line-height: 100%; color: #fff; margin-bottom: 20px; }
  .banner_right h1 {font-family: "HelveticaNowDisplay", Arial, sans-serif; font-weight: 300; font-size: 60px; line-height: 66px; color: #fff; margin-bottom: 20px; }
  .banner_right h1 span {font-weight: 600; }
  .banner_right h1 span.fw-bold {font-weight: 400;}
  .banner_right p {font-weight: 400; font-size: 20px; color: #fff; line-height: 26px; margin-bottom: 30px; }
  .banner_right a{color: #F7F4C8; font-weight: 400; font-size: 20px; line-height: 20px; border: 1px solid #F7F4C8; padding: 10px 20px; border-radius: 10px; display: inline-block; transition: all 0.3s ease-in-out; font-family: "HelveticaNowDisplay", Arial, sans-serif; }
  .banner_right a:hover{color: #375F77; background: #F7F4C8; transition: all 0.3s ease-in-out; }
  .banner_right a:focus {background: #375F77; color: #F7F4C8; transition: all 0.3s ease-in-out; border: 1px solid #375F77; }

/* ==========================================
    Plan Your Retreat Section CSS
   ========================================== */
  .plan_your_retreat_section {padding: 100px 0; }
  .plan_your_retreat_section .plan_your_retreat_heading{font-family: "HelveticaNowDisplay", Arial, sans-serif; font-weight: 300; font-size: 36px; line-height: 36px; text-align: center; text-transform: uppercase; margin-bottom: 40px; }
  .plan_your_retreat_section form {display: flex; gap: 1.16%; width: 100%; flex-wrap: wrap;}
  .plan_your_retreat_section .date-wrap{display:flex; gap:14px; flex-wrap:wrap; }
  .plan_your_retreat_section .input_fill, .plan_your_retreat_section .date-pill {width: 20%; }
  .plan_your_retreat_section input {color: #375F77; height: 51px; background: #F2F2F2; border-radius: 10px; border: none; border: 1px solid #375F77; font-weight: 400; font-size: 20px; line-height: 100%; padding: 0 20px; outline: none; width: 100%; &::placeholder{color: #375F77;} }
  .plan_your_retreat_section button {font-weight: 500; font-size: 20px; line-height: 100%; text-align: center; text-transform: uppercase; color: #F7F4C8; border: none;padding: 0 50px;height: 51px; border-radius: 10px; background-color: #375F77; cursor: pointer;transition: all 0.3s ease-in-out;}
  .plan_your_retreat_section button:hover {color: #375F77;background: #F7F4C8;border: 1px solid #375F77;transition: all 0.3s ease-in-out;}
  .plan_your_retreat_section button:active {background: #000000;color: #F7F4C8;border: 1px solid #375F77;transition: all 0.3s ease-in-out;}
  .plan_your_retreat_section .date-pill {position: relative; flex: 1; height: 51px; border: 1px solid #375F77; border-radius: 10px; background: #f5f5f5; display: flex; align-items: center; padding: 0 42px 0 14px; cursor: pointer; }
  .plan_your_retreat_section .date-text{width:100%; border:none; outline:none; background:transparent; font-size:14px; color:#222; cursor:pointer; }
  .plan_your_retreat_section .date-label {position: absolute; left: 10px; top: 10px; font-size: 20px;font-weight: 400; background: transparent; padding: 0 6px; color: #375F77; border-radius: 6px; }
  .plan_your_retreat_section .date-ic{position:absolute; right:12px; top:57%; transform:translateY(-50%); color:#6b6b6b; pointer-events:none; }
  .plan_your_retreat_section .date-real{position:absolute; inset:0; opacity:0; pointer-events:none; }
      
/* ==========================================
    Makes the Perfect Section CSS
   ========================================== */
  .makes_perfect_section {padding: 70px 0 50px; }
  .makes_perfect_section .section_heding{max-width: 790px; margin: 0 auto 40px; }
  .makes_perfect_section .section_heding h2 {font-family: The Seasons;font-weight: 400;font-size: 20px;text-align: center;color: #375F77;margin-bottom: 25px;}
  .makes_perfect_section .section_heding p{font-weight: 300;font-size: 30px;text-align: center;max-width: 750px;margin: 0 auto; }
  .makes_perfect_section .box {padding: 40px 35px 25px; color: #fff; border-radius: 15px; position: relative; z-index: 0; margin-bottom: 20px; }
  .makes_perfect_section .box::after{position: absolute; content: ''; width: 100%; height: 100%; top: 0; left: 0; background: linear-gradient(90deg, rgba(2, 2, 2, 0.5) 0%, rgba(2, 2, 2, 0) 100%); z-index: 0; border-radius: 15px; }
  .makes_perfect_section .box > * {position: relative; z-index: 2; }
  .makes_perfect_section .box h3 {font-weight: 500;font-size: 30px;line-height: 30px;margin-bottom: 12px;color: #F7F4C8;}
  .makes_perfect_section .box .box_text {font-weight: 400; font-size: 20px; line-height: 24px; margin-bottom: 40px; max-width:460px;}
  .makes_perfect_section .box .box_point_text{font-weight: 700; font-size: 18px; line-height: 20px; font-style: italic; }


/* ==========================================
     FAQs Section CSS
   ========================================== */
   section.makes_perfect_section.tre-journey {padding: 20px 0 0 0;}
  .accordion {margin: 50px 0 0; }
  .accordion-item {border-bottom: 1px solid #aaa; }
  .accordion-header {padding: 20px; font-size: 28px; cursor: pointer; display: flex; justify-content: space-between; align-items: center; }
  .icon {transition: transform 0.3s ease; }
  .accordion-content {max-height: 0; overflow: hidden; transition: all 0.3s ease; padding: 0 20px; }
  .accordion-content p {margin: 15px 0; }
  .accordion-item.active .accordion-content {max-height: fit-content; }
  .accordion-item.active .icon {transform: rotateX(180deg); } .accordion-content ul{margin-bottom: 20px; padding: 0 0 0 23px; }
  .accordion-content ul li {padding: 6px 0; list-style-type: disc; font-weight: 400; font-size: 20px; line-height: 100%; }
  .accordion-content h3 {font-weight: 700; line-height: 100%; font-size: 24px; margin-bottom: 10px; font-family: "HelveticaNowDisplay", Arial, sans-serif; }

/* ==========================================
   Testimonial Section CSS
  ========================================== */
  .testimonial_section {padding: 130px 0 80px 280px; }
  .testimonial_main {display: flex; }
  .testimonial_heading {width: 20%; }
  .testimonial_text {width: 80%; }
  .owl-theme .owl-dots, .owl-theme .owl-nav {text-align: center; -webkit-tap-highlight-color: transparent; margin-top: -25px; }
  .owl-theme .owl-dots .owl-dot span {width: 30px !important; height: 2px !important; margin: 0 !important; background: #D6D6D6; display: block; border-radius: 0 !important; }
  .owl-theme .owl-nav {margin-top: 0; gap: 110px; display: flex !important ; justify-content: center; }
  .owl-next img {opacity: 0.2; }
  .owl-theme .owl-dots .owl-dot.active span, .owl-theme .owl-dots .owl-dot:hover span {background: #000 !important; }
  .owl-theme .owl-nav [class*=owl-]:hover {background: transparent !important; color: #000; text-decoration: none; }
  .owl-theme .owl-nav .owl-next:hover img{opacity: 1; }
  .owl-theme .owl-nav .owl-prev:hover img{filter: brightness(0); }
  .owl-nav {position: absolute; left: -325px; top: 265px; }
  .owl-dots {position: absolute; left: -275px; top: 300px; }
  .owl-theme .owl-nav {margin-top: 12px;}  
  .testimonial_heading img {margin-bottom: 40px; }
  .testimonial_heading h2 {font-weight: 300; font-size: 28px; line-height: 42px; font-family: "HelveticaNowDisplay", Arial, sans-serif;}
.testimonial_main .box {
    background: #fff;
    padding: 45px 35px;
    border-radius: 15px;
    min-height: 340px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
  .testimonial_main .box p {font-weight: 300; font-size: 18px; line-height: 24px; margin-bottom: 5px;color: #375F77; }
  .testimonial_main .box a {font-weight: 600; font-size: 18px; line-height: 24px; margin-bottom: 30px;color: #375F77;display: inline-block; }
  .text_box h4 {font-weight: 700;color: #375F77; font-size: 18px; line-height: 100%; font-family: 'Nimbus', sans-serif; font-style: italic; text-transform: uppercase; margin-bottom: 5px; }



/* ==========================================
   Footer Section CSS
  ========================================== */
  .footer_section{background-color: #375F77; }
  .footer_main {display: flex; justify-content: space-between; }
  .footer_main a {color: #fff; padding: 3px 0; font-size: 16px; font-weight: 400;font-family: "HelveticaNowDisplay", Arial, sans-serif; }
  .footer_logo {width: 13%; }
  .footer_link {width: 20%; }
  .footer_address {width: 35%; }
  .footer_section {padding: 80px 0 0; }
  .footer_main h3 {font-family: "HelveticaNowDisplay", Arial, sans-serif;font-size: 28px; color: #fff; font-weight: 600; text-transform: capitalize; border-bottom: 1px solid #fff; padding: 0 0 5px 0; margin-bottom: 30px; }
  .contact_box {display: flex; align-items: center; gap: 10px; }
  .media_box {display: flex; gap: 10px; margin-top: 30px; }
  .footer_link li {margin-bottom: 5px; }
  .media_box a {padding: 12px !important; border: 1px solid #fff; }
  .contact_box {display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
  .copy_right {color: #fff;font-size: 18px;}
  .copy_right_box {display: flex;justify-content: space-between; align-items: center; padding: 30px 0;border-top: 1px solid #fff; margin-top: 40px;}
  .copy_right_box a { color: #fff;text-decoration: underline;}
  .copy_right a{ color: #fff; font-size: 18px; font-weight: 700; text-decoration: none;}
  .number-ctn {  font-family: "Noto Serif", serif;}


   @media (max-width:1680px) {
      .testimonial_section {padding: 130px 0 80px 170px; }
   }

   @media (max-width: 1440px) {
      .testimonial_section {padding: 130px 0 80px 60px; }
      .owl-nav {position: absolute; left: -280px; top: 265px; }
      .owl-dots {position: absolute; left: -230px; top: 300px; }
   }

   @media (max-width: 1280px) {
      .testimonial_section {padding: 130px 0 80px 10px; }
      .owl-nav {left: -260px; }
      .owl-dots {left: -210px; }
  }

  @media (max-width: 1024px){
    .plan_your_retreat_section .input_fill, .plan_your_retreat_section .date-pill {width: 32%;}
    .plan_your_retreat_section form {justify-content: space-between; row-gap: 20px;}
    .testimonial_text {width: 75%; }
    .testimonial_heading {width: 25%; }
    .owl-dots {left: -225px; }
    .testimonial_section {padding: 50px 20px 60px; }
    .begin_your_section {padding: 50px 0; }
    .footer_section {padding: 50px 0 0; }
    .banner_section {padding: 20px;}
    .banner_right h2 {font-size: 24px;}
    .banner_right h1 {font-size: 48px;line-height: 50px;}
    .banner_right p {font-size: 18px;line-height: 24px;}
  }

  @media (max-width: 768px){

    .testimonial_heading {width: 35%; }
    .testimonial_text {width: 65%; }
    .plan_your_retreat_section .input_fill, .plan_your_retreat_section .date-pill {width: 100%;}
    .plan_your_retreat_section button{width: 100%;}
    .footer_main {display: flex; justify-content: space-between; flex-wrap: wrap; row-gap: 30px; }
    .footer_logo {width: 48%; }
    .footer_link {width: 48%; }
    .footer_address {width: 48%; }
    .owl-theme .owl-nav {margin-top: 10px; left: 40%;bottom: -180px; }
    .owl-dots {display: none; }
    .owl-nav img {width: 30px; }          
    .testimonial_main {display: flex; flex-direction: column; }
    .testimonial_heading {width: 100%; text-align: center; display: flex; flex-direction: column; align-items: center; }
    .testimonial_text {width: 100%; padding-top: 30px; }
    .banner_bottom{padding-top: 50px;}
    .banner_left {width: 30%; }
    .banner_right {
    width: 70%;
}
  }

  @media (max-width: 480px){     
          .banner_section{padding: 50px; background: url(../images/mobail_banner.webp) no-repeat center left 0; background-size: cover; height: 100vh; }
 
    .copy_right_box {flex-direction: column; gap: 10px;}     
    .footer_logo {width: 100%; }
    .footer_link {width: 100%; }
    .footer_address {width: 100%; }      
    .footer_logo img {width: 125px;}     
    .owl-carousel .owl-nav {left: 88px;bottom: -106px;}
    .testimonial_section { padding: 50px 20px 80px; }
    .banner_right h2 {font-size: 14px; }
    .banner_right h1 {font-size: 28px;line-height: 36px;}
    .banner_right p {font-size: 14px;line-height: 18px;}
    .banner_right a {font-size: 16px;padding: 6px 20px;}
    .banner_bottom {padding-top: 10vh;}
    .makes_perfect_section .section_heding p {font-size: 16px;}
    .makes_perfect_section .box h3 {font-size: 24px;}
    .makes_perfect_section .box .box_text {font-size: 18px;}
    .accordion-header {font-size: 18px;}
    .accordion-content ul li {font-size: 16px; line-height: 20px;}
.accordion-content h3 {font-size: 20px;}
.plan_your_retreat_section .plan_your_retreat_heading { font-size: 26px;}







  }

