#banner-sec .container, .container {
  max-width: 1360px !important;
}

.guest-hero-sec .right-content{
    height: 768px;
    position: relative;
}

.guest-hero-sec .right-content::after {
  content: "";
  position: absolute;
  bottom: -146px;
  right: 84px;
  width: 172px;
  height: 168px;
  z-index: -1;
  background-image: url(../../assets/careers-new/images/sparkle-star.webp);
}

.guest-hero-sec .right-content img{
    display: none;
}


#banner-sec {
  width: 1360px;
  max-width: 100%;
  margin: 0 auto;
  background-image: url("./images/banner-imgs.jpg?v=1.1");
  background-position: top right;
  background-repeat: no-repeat;
  background-size: 610px;
  padding: 275px 0px 50px 0px;
  z-index: 9;
  position: relative;
}
.guest-hero-sec {
  background-image: url(/public/frontEnd/assets/images/guest-pass-latest-banner.jpg) !important;
  padding: 50px 0px 50px 0px !important;
}


.guest-hero-sec .left-content h3 {
  font-size: 32px;
  letter-spacing: -1px;
  line-height: 56px;
  color: #6b6e74;
  font-family: "DynaPuff" !important;
  font-weight: 500 !important;
  color: #fec92d;
  text-align: left;
}

.guest-hero-sec .left-content h2 {
font-family: 'HelveticaNeueBold';
  color: #393d46 !important;
  font-weight: bold !important;
  font-size: 48px !important;
  letter-spacing: -1px !important;
  line-height: 56px !important;
}

#guestpass-form input, #guestpass-form select {
  width: 100% !important;
  font-size: 14px;
  line-height: 26px;
  color: #212529;
  font-weight: 200 !important;
  font-family: "Poppins", sans-serif;
  height: 55px;
  background-color: #fdfdfd;
  border: 0.5px solid #c9c9c9;
  padding: 20px;
  margin-bottom: 20px;
}


.checkbox.style-c {
  display: inline-block;
  position: relative;
  padding-left: 30px;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

.checkbox.style-c input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

.checkbox.style-c input:checked ~ .checkbox__checkmark {
  background-color: transparent;
  border: solid 1px #ccc;
}

.checkbox.style-c .checkbox__checkmark {
  position: absolute;
  top: 2px;
  left: 0;
  height: 15px;
  width: 15px;
  background-color: transparent;
  transition: background-color 0.25s ease;
  border-radius: 0px;
  border: solid 1px #ccc;
}


.checkbox.style-c .checkbox__checkmark::after {
  content: "";
  position: absolute;
  left: 7px;
  top: -5px;
  width: 7px;
  height: 16px;
  border: solid #333;
    border-top-width: medium;
    border-right-width: medium;
    border-bottom-width: medium;
    border-left-width: medium;
  border-width: 0 3px 3px 0;
  transform: rotate(45deg);
  opacity: 0;
  transition: opacity 0.25s ease;
}



.checkbox.style-c input:checked ~ .checkbox__checkmark::after {
  opacity: 1;
}





/* 8 April 2026 */

.sty-sparkle-dropdown-wrap { position: relative;}
.sty-sparkle-dropdown-wrap ul{ position: absolute;
  position: absolute;
  top: calc(100% + 10px);
  left: 0;
  right: 0;
  z-index: 1050;
  background: #fff;
  border: 1px solid #ced4da;
  border-radius: 0.375rem;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.10);
  padding: 10px 25px;
  list-style: none;
  line-height: 28px;
  max-height: 200px;
  overflow: auto;
  margin-bottom: 0;
}

.sty-sparkle-dropdown-wrap ul li{
  border-bottom: solid 1px #D5D7DA85;
  padding: 9px 0;
  text-align: left;
}


 #banner-sec .sty-sparkle-ul-breed.d-none{
    display: none !important;
}

 #banner-sec .sty-sparkle-ul-breed:not(.d-none){
    display: block !important;
}

.sty-sparkle-dropdown-wrap ul li:last-child{
  border-bottom: none;
}

#guestpass-form.sty-sparkle-guestpass-form .form-group{
  margin-bottom: 20px;
}

#guestpass-form.sty-sparkle-guestpass-form .form-group input{
  margin-bottom: 0;
}

#guestpass-form.sty-sparkle-guestpass-form .sty-sparkle-field-error{
  color: #dc3545;
  font-size: 12px;
}




.guest-hero-sec .hero-inner .right-content::after{
  z-index: 1;
  bottom: -92px;
}



.guest-hero-sec .hero-inner .left-content{padding-right: 0; padding-top: 0;}

#banner-sec .container, .container {
  max-width: 1300px !important;
}

.sty-sparkle-guestpass-form{margin-top: 30px;}
.checkbox_one_outer{margin-top: 30px;  margin-bottom: 20px;}

/* Two consent boxes now stack here. The 30px top margin is meant to separate the
   block from the fields above it, not to space the boxes from each other. */
.checkbox_one_outer + .checkbox_one_outer{margin-top: 12px;}

/* The consent error has to be readable and has to point at the box it refers to.
   Shared 12px red text sitting above an unticked checkbox was too easy to miss,
   and "Please agree" on its own does not say which box or why. */
#guestpass-form.sty-sparkle-guestpass-form .js-checkbox_privacy:not(:empty){
  display: block;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.4;
  margin-bottom: 8px;
}

#guestpass-form.sty-sparkle-guestpass-form .checkbox_one_outer.has-consent-error{
  background: #fdf2f3;
  border-left: 3px solid #dc3545;
  border-radius: 4px;
  padding: 10px 12px;
}

/* The generic checkbox styling paints links #b9b9b9 with no underline — roughly
   1.9:1 against white. These two link to the documents the customer is being
   asked to agree to, so they have to be legible and look clickable. */
#guestpass-form.sty-sparkle-guestpass-form .checkbox__body a{
  color: inherit;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;

  /* The real checkbox is position:absolute, opacity:0 and stretched across the
     whole label — that is how clicking the text toggles it. It also sits on top
     of these links, so clicking "Privacy Policy" only ticked the box and never
     opened the policy. Lifting the anchors above it restores the link without
     breaking toggling anywhere else in the label. */
  position: relative;
  z-index: 2;
}

#guestpass-form #theme-btn {
  padding: 13px 40px !important;
  font-size: 16px;
  font-weight: 500 !important;
  margin-top: 0px;
  margin-bottom: 0px !important;
  border: 0;
  width: auto !important;
  color: #000;
  background-color: #393d46 !important;
  margin-top: 0px;
  margin-bottom: 40px !important;
  font-family: "Poppins", sans-serif;
  height: 55px;
  line-height: 26px;
  color: #fff !important;
  border-radius: 25px;
  text-align: center;
}

#guestpass-form #theme-btn:hover {
  background-color: #fec92d !important;
  color: #fff !important;
}

.monthly-plan {
  font-size: 12px !important;
  line-height: 18px !important;
  color: #c9c9c9;
  font-weight: 300;
  font-family: "Poppins", sans-serif;
  margin-bottom: 20px;
}


#guestpass-form .checkbox__body {
  font-family: "Poppins", sans-serif !important;
  font-size: 14px !important;
}


#guestpass-form .checkbox__body a {
  font-size: 16px;
  line-height: 22px;
  color: #b9b9b9;
  font-weight: 400;
  font-family: "Poppins";
  margin-left: 6px;
}
#guestpass-form .checkbox__body a:hover {
    color: #fec92d;
}

#guestpass-form input:focus-visible, #guestpass-form select:focus-visible{
    box-shadow: none;
  outline: none;
}




@media (max-width: 1199px) {
    .guest-hero-sec .right-content img {
        display: block;
    }

    .guest-hero-sec{
        background-image: unset !important;
    }

    #guestpass-form{overflow: hidden;}
}
@media (max-width: 767px) {
  .guest-hero-sec .right-content img {
    display: block;
    width: 100%;
    }

    #banner-sec.guest-hero-sec .hero-inner {
        flex-direction: column;
    } 

    #banner-sec.guest-hero-sec .hero-inner .col-6{
        flex: 0 0 auto;
        width: 100%;
        height: auto;
        padding: 0 25px;
    }

    #banner-sec.guest-hero-sec .hero-inner .col-6.right-content{
        padding: 10px 0 0;
    }

    .guest-hero-sec .right-content::after{
        display: none;
    }

     /* #banner-sec .row{
        margin-left: 0;
        margin-right: 0;
     } */
}