@import url('https://fonts.googleapis.com/css2?family=Public+Sans:wght@400;700&family=Krona+One&display=swap');

* {
  margin: 0;
  padding: 0;
}
header {
  position: fixed;
  top: 0;
  right: 0px;
  width: 100%;
  z-index: 1000; 
  padding-right: 50px;
  display: flex;
  justify-content: flex-end;
  background-color: #ffffff;
  align-items: center;
  height: 100px;
  font-style: bold;
}

header ul {
  display: flex;
  list-style-type: none;
  font-size: 1.5rem;
  gap: 80px;
  text-align: center;
  align-items: center;
  font-family: poppins;
  transition: 0.3s;
  
}

header ul a:hover {
  background-color: #E5C100;
  border-radius: 30px;
  padding: 5px 10px;
}

.booknaw a {
 
  background: #E5C100;
  border-radius: 20px;
  color: white;
  padding: 8px 15px;
  text-decoration: none;
  font-family: poppins;
  transition: 0.3s;
  font-weight: bold;
  
}

header ul a {
  text-decoration: none;
  color: black;
  padding: 5px 10px;
  
}
body {
  background-color: #ffffff;
}
.logo {
  position: absolute;
  left: 80px;
  display: flex;
  width: 120px;
  height: 100px;
  
}
.logo-pic {
  position: absolute;
  left: 1000px;
  display: flex;
  width: 100px;
  height: 100px;
  background-color: #0c0a0954;
  left: 0px;
}
.pic1 {
  position: absolute;
  top: 100px;
  width: 100%;
  height: 990px;
  object-fit: cover;
}
.pict {
  position: absolute;
  top: 100px;
  width: 100%;
  height: 1000px;
  object-fit: cover;
  filter:brightness(0.6);
}
.name {
  position: absolute;
  top: 540px;
  left: 620px;
  font-size: 5rem;
  font-weight: bold;
  text-align: center;
  align-items: center;
  color: white;
  font-family: poppins;
}
.box1 {
  position: absolute;
  left: 750px;
  top: 800px;
  width: 9%;
  height: auto;
  background: #ffd700;
  border-radius: 10px;
  justify-content: center;
  padding-top: 17px;
  padding-bottom: 17px;
}

.box1:hover {
  filter:brightness(70%);
}

.box2 {
  position: absolute;
  left: 1000px;
  top: 800px;
  width: 9%;
  height: auto;
  background: #ffffff;
  border-radius: 10px;
  padding-top: 17px;
  padding-bottom: 17px;
  text-align: center;
}

.box2:hover {
  filter:brightness(70%);
}

.room {
  
  text-align: center;
  font-size: 1.2rem;
  font-weight: bold;
  color: #ffffff;
  font-family: poppins;
  
}





.contact {
  font-size: 1.2rem;
  font-weight: bold;
  font-family: poppins;
  color: #000000;
}
.lux {
  position: absolute;
  left: 680px;
  top: 1150px;
  font-size: 3.3rem;
  font-weight: bold;
  font-family: poppins;
}
.lux-text {
  position: absolute;
  left: 410px;
  top: 1235px;
  font-size: 1.75rem;
  font-family: poppins;
}
.box3 {
  position: absolute;
  left: 30px;
  top: 1350px;
  width: 420px;
  height: 350px;
  border-color: black;
  border-width: 2px;
  border-style: solid;
  transition: 0.3s;
}
.box3:hover {
  background-color: #E5C100;
}

.box4 {
  position: absolute;
  left: 505px;
  top: 1350px;
  width: 420px;
  height: 350px;
  border-color: black;
  border-width: 2px;
  border-style: solid;
  transition: 0.3s;
}

.box4:hover {
  background-color: #E5C100;
}


.box5 {
  position: absolute;
  left: 978px;
  top: 1350px;
  width: 420px;
  height: 350px;
  border-color: rgb(0, 0, 0);
  border-width: 2px;
  border-style: solid;
  transition: 0.3s;
}

.box5:hover {
  background-color: #E5C100;
}

.box6 {
  position: absolute;
  left: 1450px;
  top: 1350px;
  width: 420px;
  height: 350px;
  border-color: black;
  border-width: 2px;
  border-style: solid;
  transition: 0.3s;
}

.box6:hover {
  background-color: #E5C100;
}

.b3 {
  position: absolute;
  top: 1425px;
  left: 130px;
  font-size: 2.5rem;
  font-weight: bold;
  font-family: poppins;
}


.b4 {
  position: absolute;
  left: 605px;
  top: 1425px;
  font-size: 2.5rem;
  font-weight: bold;
  font-family: poppins;
}
.b5 {
  position: absolute;
  left: 1050px;
  top: 1425px;
  font-size: 2.5rem;
  font-weight: bold;
  font-family: poppins;
}
.b6 {
  position: absolute;
  left: 1540px;
  top: 1425px;
  font-size: 2.5rem;
  font-weight: bold;
  font-family: poppins;
}
.b3-text {
  position: absolute;
  text-align: center;
  left: 46px;
  top: 1500px;
  font-size: 1.35rem;
  font-family: poppins; 
}


.b4-text {
  position: absolute;
  text-align: center;
  left: 553px;
  top: 1500px;
  font-size: 1.35rem;
  font-family: poppins;
}
.b5-text {
  position: absolute;
  text-align: center;
  left: 1010px;
  top: 1500px;
  font-size: 1.35rem;
  font-family: poppins;
}
.b6-text {
  position: absolute;
  text-align: center;
  left: 1485px;
  top: 1500px;
  font-size: 1.35rem;
  font-family: poppins;
}
.high {
  position: absolute;
  left: 705px;
  top: 1900px;
  font-size: 3.5rem;
  font-weight: bold;
  font-family: poppins;
}
.high1 {
  position: absolute;
  left: 100px;
  top: 2050px;
  width: 420px;
  height: 350px;
}
.pic1 {
  position: absolute;
  left: 30px;
  top: 2020px;
  width: 550px;
  height: 400px;
  border-radius: 20px;
  transition: 0.3s;
  object-fit: cover;
}

.pic1:hover {
  transform: scale(1.1);
  filter: brightness(80%);
}

.high2 {
  position: absolute;
  left: 745px;
  top: 2050px;
  width: 420px;
  height: 350px;
}
.pic2 {
  position: absolute;
  left: 675px;
  top: 2020px;
  width: 550px;
  height: 400px;
  border-radius: 20px;
  transition: 0.3s;
  object-fit: cover;
}

.pic2:hover {
  transform: scale(1.1);
  filter: brightness(80%);
}

.high3 {
  position: absolute;
  left: 1390px;
  top: 2050px;
  width: 420px;
  height: 350px;
}
.pic3 {
  position: absolute;
  left: 1320px;
  top: 2020px;
  width: 550px;
  height: 400px;
  border-radius: 20px;
  transition: 0.3s;
  object-fit: cover;
}

.pic3:hover {
  transform: scale(1.1);
  filter: brightness(80%);
}

.ready {
  position: absolute;
  left: 0px;
  top: 2650px;
  width: 100%;
  height: 430px;
  background-color: #ffd700;
}
.readytext {
  position: absolute;
  left: 505px;
  top: 2740px;
  font-size: 4rem;
  font-weight: bold;
  color: white;
  font-family: poppins;
}
.redi {
  position: absolute;
  color: white;
  font-size: 1.75rem;
  left: 550px;
  top: 2840px;
  height: 60px;
  font-family: poppins;
}
.booky {
  position: absolute;
  left: 850px;
  top: 2900px;
  width: 200px;
  height: 60px;
  background-color: #ffffff;
  border-radius: 10px;
  font-size: 1.3rem;
  font-weight: bold;
  text-align: center;
  line-height: 60px;
  font-family: poppins;
  color: #000000;
}

.booky:hover {
  filter: brightness(70%);
}

.quick {
  position: absolute;
  left: 0px;
  top: 3050px;
  width: 100%;
  height: 580px;
  background-color: #b59410;
}
.links {
  position: absolute;
  left: 350px;
  top: 3150px;
  font-size: 1.2rem;
  font-weight: bold;
  color: white;
  font-family: poppins;
}
.aminiti {
  position: absolute;
  left: 350px;
  top: 3250px;
  font-size: 1.5rem;
  color: white;
  font-family: poppins;
}

.abawt {
  position: absolute;
  left: 350px;
  top: 3320px;
  font-size: 1.5rem;
  color: white;
  font-family: poppins;
}

.kuntakt {
  position: absolute;
  left: 350px;
  top: 3390px;
  font-size: 1.5rem;
  color: white;
  font-family: poppins;
}

.buknaw {
  position: absolute;
  left: 350px;
  top: 3460px;
  font-size: 1.5rem;
  color: white;
  font-family: poppins;
}


.kontak {
  position: absolute;
  left: 865px;
  top: 3150px;
  font-size: 1.2rem;
  font-weight: bold;
  color: white;
  font-family: poppins;
}

.nos {
  position: absolute;
  left: 855px;
  top: 3250px;
  font-size: 1.5rem;
  color: white;
  font-family: poppins;
}

.imeyl {
  position: absolute;
  left: 855px;
  top: 3320px;
  font-size: 1.5rem;
  color: white;
  font-family: poppins;
}

.lokeyson {
  position: absolute;
  left: 855px;
  top: 3390px;
  font-size: 1.5rem;
  color: white;
  font-family: poppins;
  width: 400px;
} 



.follow {
  position: absolute;
  left: 1305px;
  top: 3150px;
  font-size: 1.2rem;
  color: white;
  font-family: poppins;
}

.istag {
  position: absolute;
  left: 1335px;
  top: 3220px;
  font-size: 3rem;
  color: white;
  font-family: poppins;
}

.peys {
  position: absolute;
  left: 1390px;
  top: 3220px;
  font-size: 3rem;
  color: white;
  font-family: poppins;}



footer {
  position: absolute;
  justify-content: center;
  display: flex;
  padding: 20px;
  font-size: 1.5rem;
  top: 3630px;
  height: 70px;
  width: 100%;
  box-sizing: border-box;
  background-color: #b59410;
  color: white;
  border-color: #ffffff;
  border-width: 1px;
  border-top-style: solid;
}
.header {
  position: absolute;
  left: 0px;
  top: 0px;
  width: 100%;
  height: 100px;
  background-color: #ffffff;
}
.world {
  position: absolute;
  left: 0px;
  top: 100px;
  width: 100%;
  height: 350px;
  background-color: #EFBF04;
}
.worldtext {
  position: absolute;
  left: 590px;
  top: 200px;
  font-size: 4rem;
  font-weight: bold;
  color: rgb(255, 255, 255);
  font-family: poppins;
}
.worldtext2 {
  position: absolute;
  left: 600px;
  top: 300px;
  font-size: 1.75rem;
  color: rgb(255, 255, 255);
  font-family: poppins;
}
.liv {
  position: absolute;
  left: 100px;
  top: 600px;
  width: 860px;
  background-color: #b59410;
  border-radius: 20px;
  height: 500px;
  background-color: #d9d9d9;
}
.livpic {
  object-fit: cover;
  position: absolute;
  left: 100px;
  top: 600px;
  width: 860px;
  border-radius: 20px;
  height: 500px;
}
.livtext {
  position: absolute;
  left: 1000px;
  top: 750px;
  font-size: 3rem;
  font-weight: bold;
  color: rgb(0, 0, 0);
  font-family: poppins;
}
.livtext2 {
  position: absolute;
  left: 1000px;
  top: 850px;
  font-size: 2rem;
  color: rgb(0, 0, 0);
  font-family: poppins;
}
.bball {
  position: absolute;
  left: 1000px;
  top: 1200px;
  width: 860px;
  border-radius: 20px;
  height: 500px;
  background-color: #d9d9d9;
}
.bballpic {
  position: absolute;
  left: 1000px;
  top: 1200px;
  width: 860px;
  border-radius: 20px;
  height: 500px;
  object-fit: cover;
}
.bballtext {
  position: absolute;
  left: 100px;
  top: 1350px;
  font-size: 3rem;
  font-weight: bold;
  color: rgb(0, 0, 0);
  font-family: poppins;
}
.bballtext2 {
  position: absolute;
  left: 100px;
  top: 1450px;
  font-size: 2rem;
  color: rgb(0, 0, 0);
  font-family: poppins;
}
.bed {
  position: absolute;
  left: 100px;
  top: 1800px;
  width: 860px;
  border-radius: 20px;
  height: 500px;
  background-color: #d9d9d9;
}
.bedpic {
  position: absolute;
  left: 100px;
  top: 1800px;
  width: 860px;
  border-radius: 20px;
  height: 500px;
}
.bedtext {
  position: absolute;
  left: 1000px;
  top: 1950px;
  font-size: 3rem;
  font-weight: bold;
  color: rgb(0, 0, 0);
  font-family: poppins;
}
.bedtext2 {
  position: absolute;
  left: 1000px;
  top: 2050px;
  font-size: 2rem;
  color: rgb(0, 0, 0);
  font-family: poppins;
}
.chill {
  position: absolute;
  left: 1000px;
  top: 2400px;
  width: 860px;
  border-radius: 20px;
  height: 500px;
  background-color: #d9d9d9;
}
.chillpic {
  position: absolute;
  left: 1000px;
  top: 2400px;
  width: 860px;
  border-radius: 20px;
  height: 500px;
}
.chilltext {
  position: absolute;
  left: 100px;
  top: 2550px;
  font-size: 3rem;
  font-weight: bold;
  color: rgb(0, 0, 0);
  font-family: poppins;
}
.chilltext2 {
  position: absolute;
  left: 100px;
  top: 2650px;
  font-size: 2rem;
  color: rgb(0, 0, 0);
  font-family: poppins;
}
.footer2 {
  position: absolute;
  left: 0px;
  top: 2950px;
  height: 70px;
  width: 100%;
  box-sizing: border-box;
  background-color: #b59410;
  color: white;
  border-color: #ffffff;
  border-width: 1px;
  border-top-style: solid;
}
.show-link1 {
  text-decoration: none;
  color: black;
  background-color: #E5C100;
  border-radius: 30px;
  padding: 5px 10px;
  
}

.show-link {
  text-decoration: none;
  color: black;
}

.show-link2 {
  text-decoration: none;
  color: black;
  background-color: #E5C100;
  border-radius: 30px;
  padding: 5px 10px;
  
}

.show-link3 {
  text-decoration: none;
  color: black;
  background-color: #E5C100;
  border-radius: 30px;
  padding: 5px 10px;
  
}

.show-link4 {
  text-decoration: none;
  color: black;
  background-color: #E5C100;
  border-radius: 30px;
  padding: 5px 10px;
  
}


.contactus {
  position: absolute;
  left: 770px;
  top: 200px;
  font-size: 4rem;
  font-weight: bold;
  color: rgb(255, 255, 255);
  font-family: poppins;
}
.contactext {
  position: absolute;
  left: 640px;
  top: 300px;
  font-size: 1.75rem;
  color: rgb(255, 255, 255);
  font-family: poppins;
}
.get {
  position: absolute;
  left: 70px;
  top: 480px;
  font-size: 3.5rem;
  font-weight: bold;
  color: rgb(0, 0, 0);
  font-family: poppins;
}

.map {
  position: absolute;
  left: 910px;
  top: 480px;
  font-size: 3.8rem;
  font-weight: bold;
  color: rgb(0, 0, 0);
  font-family: poppins;
}

.mapis {
  position: absolute;
  left: 900px;
  top: 610px;
  width: 860px;
  border-radius: 20px;
  height: 640px;
}

.phonelogo {
  position: absolute;
  left: 70px;
  top: 600px;
  width: 80px;
  height: 80px;
  background-color: #FFEEAA;
  border-radius: 50%;
}
.phonelogo i {
  position: absolute;
  left: 10px;
  top: 20px;
  font-size: 3rem;
  color: #EFBF04;
}

.emaillogo i {
  position: absolute;
  left: 5px;
  top: 12px;
  font-size: 3.5rem;
  color: #EFBF04;
}

.addresslogo i {
  position: absolute;
  left: 5px;
  top: 13px;
  font-size: 3.5rem;
  color: #EFBF04;
}

.hourslogo i {
  position: absolute;
  left: 5px;
  top: 12px;
  font-size: 3.5rem;
  color: #EFBF04;
}

.phonetext {
  position: absolute;
  left: 200px;
  top: 600px;
  font-size: 2rem;
  font-weight: bold;
  color: rgb(0, 0, 0);
  font-family: poppins;
}
.phone {
   width: 400px;
  position: absolute;
  left: 200px;
  top: 650px;
  font-size: 1.4rem;
  font-family: poppins;
  
}
.emaillogo {
  position: absolute;
  left: 70px;
  top: 775px;
  width: 80px;
  height: 80px;
  background-color: #FFEEAA;
  border-radius: 50%;
}
.emailtext {
  position: absolute;
  left: 200px;
  top: 775px;
  font-size: 2rem;
  font-weight: bold;
  color: rgb(0, 0, 0);
  font-family: poppins;
}
.email {
  width: 400px;
  position: absolute;
  font-size: 1.4rem;
  left: 200px;
  top: 825px;
  color: #000000;
  font-family: poppins;
}
.addresslogo {
  position: absolute;
  left: 70px;
  top: 960px;
  width: 80px;
  height: 80px;
  background-color: #FFEEAA;
  border-radius: 50%;
}
.addresstext {
  position: absolute;
  left: 200px;
  top: 960px;
  font-size: 2rem;
  font-weight: bold;
  color: rgb(0, 0, 0);
  font-family: poppins;
}
.address {
  width: 500px;
  height: 4px;
  position: absolute;
  left: 200px;
  top: 1010px;
  font: black;
  font-size: 1.4rem;
  font-family: poppins;
  
}
.hourslogo {
  position: absolute;
  left: 70px;
  top: 1155px;
  width: 80px;
  height: 80px;
  background-color: #FFEEAA;
  border-radius: 50%;
}
.hourstext {
  position: absolute;
  left: 200px;
  top: 1160px;
  font-size: 2rem;
  font-weight: bold;
  color: rgb(0, 0, 0);
  font-family: poppins;
}
.businesshours {
  width: 400px;
  height: 4px;
  position: absolute;
  left: 200px;
  top: 1210px;
  color: black;
  font-size: 1.4rem;
  font-family: poppins;
}
.footer3 {
  position: absolute;
  left: 0px;
  top: 1380px;
  height: 70px;
  width: 100%;
  box-sizing: border-box;
  background-color: #b59410;
  color: white;
  border-color: #ffffff;
  border-width: 1px;
  border-top-style: solid;
}

.pictu {
  object-fit: cover;
  position: absolute;
  top: 100px;
  width: 100%;
  height: 850px;
  filter:brightness(0.8);
}

.aboutnice {
  position: absolute;
  top: 400px;
  left: 480px;
  font-size: 5rem;
  font-weight: bold;
  text-align: center;
  align-items: center;
  color: white;
  font-family: poppins;
}

.abouttitle {
  position: absolute;
  top: 1030px;
  left: 290px;
  font-size: 4rem;
  color: black;
  font-weight: bold;
  font-family: poppins;
  
}

.aboutnice1 {
  position: absolute;
  top: 1150px;
  left: 70px;
  font-size: 2.1rem;
  color: black;
  width: 760px;
  line-height: 1.5;
  font-family: poppins;
}

.ourstory {
  object-fit: cover;
  position: absolute;
  top: 1000px;
  width: 950px;
  height: 700px;
  left: 900px;
  border-radius: 10px;
  
 
}

.values {
  position: absolute;
  top: 1900px;
  left: 780px;
  font-size: 4rem;
  color: black;
  font-weight: bold;
  font-family: poppins;
}

.values-text {
  position: absolute;
  left: 625px;
  top: 1990px;
  font-size: 2rem;
  font-family: poppins;
}

.box7 {
  position: absolute;
  left: 30px;
  top: 2120px;
  width: 420px;
  height: 350px;
  border-color: black;
  border-width: 2px;
  border-style: solid;
  transition: 0.3s;
}

.box7:hover {
  background-color: #E5C100;
}

.box8{
  position: absolute;
  left: 505px;
  top: 2120px;
  width: 420px;
  height: 350px;
  border-color: black;
  border-width: 2px;
  border-style: solid;
  transition: 0.3s;
}

.box8:hover {
  background-color: #E5C100;
}

.box9 {
  position: absolute;
  left: 978px;
  top: 2120px;
  width: 420px;
  height: 350px;
  border-color: rgb(0, 0, 0);
  border-width: 2px;
  border-style: solid;
  transition: 0.3s;
}

.box9:hover {
  background-color: #E5C100;
}
.box10 {
  position: absolute;
  left: 1450px;
  top: 2120px;
  width: 420px;
  height: 350px;
  border-color: black;
  border-width: 2px;
  border-style: solid;
  transition: 0.3s;
}

.box10:hover {
  background-color: #E5C100;
}
.b7 {
  position: absolute;
  top: 2200px;
  left: 130px;
  font-size: 2.5rem;
  font-weight: bold;
  font-family: poppins;
}
.b8 {
  position: absolute;
  left: 605px;
  top: 2200px;
  font-size: 2.5rem;
  font-weight: bold;
  font-family: poppins;
}
.b9 {
  position: absolute;
  left: 1050px;
  top: 2200px;
  font-size: 2.5rem;
  font-weight: bold;
  font-family: poppins;
}
.b10 {
  position: absolute;
  left: 1540px;
  top: 2200px;
  font-size: 2.5rem;
  font-weight: bold;
  font-family: poppins;
}
.b7-text {
  position: absolute;
  text-align: center;
  left: 46px;
  top: 2270px;
  font-size: 1.35rem;
  font-family: poppins;
}
.b8-text {
  position: absolute;
  text-align: center;
  left: 550px;
  top: 2270px;
  font-size: 1.35rem;
  font-family: poppins;
}
.b9-text {
  position: absolute;
  text-align: center;
  left: 1010px;
  top: 2270px;
  font-size: 1.35rem;
  font-family: poppins;
}
.b10-text {
  position: absolute;
  text-align: center;
  left: 1485px;
  top: 2270px;
  font-size: 1.35rem;
  font-family: poppins;
}

.sustainability {
  position: absolute;
  top: 2570px;
  width: 100%;
  height: 900px;
  background-color: #EFBF04;
}

.sustainability-text {
  position: absolute;
  left: 1080px;
  top: 2670px;
  font-size: 3.8rem;
  font-weight: bold;
  color: black ;
  width: 650px;
  text-align: center;
  line-height: 1.3;
  font-family: poppins;
}

.sustainability-text2 {
  position: absolute;
  left:950px;
  top: 2880px;
  font-size: 2.2rem;
  color: black;
  width: 790px;
  line-height: 1.3;
  font-family: poppins;
}

.commitment {
  object-fit: cover;
  position: absolute;
  top: 2650px;
  width: 800px;
  height: 690px;
  left: 50px;
  border-radius: 10px;
}
  
.footer4 {
  position: absolute;
  top: 3400px;
  height: 70px;
  width: 100%;
  box-sizing: border-box;
  background-color: #b59410;
  
}

html, body {
    margin: 0;
    padding: 0;
    width: 100%;
    height: 100vh;
    background-color: #ffffff;
    font-family: 'Poppins', sans-serif;
}

.buk {
    position: absolute;
    height: 120px; 
    width: 100%;
    background-color: #FFD700;
    top: 0;
    left: 0;
    z-index: 1;
}

.bukyor {
    position: absolute;
    left: 50px; 
    top: 60px; 
    transform: translateY(-50%); 
    z-index: 2;
    text-decoration: none;
}

.bukyor h1 {
    font-size: 3.5rem; 
    font-weight: 800;
    color: white;
    margin: 0;
    font-family: 'Poppins', sans-serif;
}

.bukyor:hover {
    filter: brightness(0.9);
    transition: 0.3s;
}

.form-wrapper {
    position: relative;
    top: 120px; 
    height: calc(100vh - 120px);
    width: 100%;
    display: flex;
    justify-content: center;
    padding: 60px 20px;
    box-sizing: border-box;
    overflow-y: auto;
}

.booking-form {
    width: 95%; 
    max-width: 1200px; 
}

.form-title {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 2rem; 
    margin: 50px 0 30px;
    color: #222;
    font-weight: 800;
    text-transform: none;
}

.section-title {
    display: block;
    width: 100%;
    text-align: center;
    font-size: 1.8rem; 
    margin: 50px 0 30px;
    color: #222;
    font-weight: 700;
    text-transform: uppercase;
}

.row {
    display: flex;
    gap: 40px; 
    margin-bottom: 25px;
}

.group {
    flex: 1;
}

label {
    display: block;
    font-weight: 700;
    margin-bottom: 12px;
    text-align: center;
    font-size: 1.5rem; 
    color: #000;
}

input, textarea {
    width: 100%;
    padding: 20px; 
    border: 2px solid #ccc;
    border-radius: 10px;
    font-size: 1.2rem; 
    font-family: inherit;
    text-align: center;
    box-sizing: border-box;
    background-color: #fafafa;
}

input:focus {
    border-color: #FFD700;
    outline: none;
}





.footer-buttons {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 50px;
    padding-bottom: 80px;
}

.btn-cancel {
    background: none;
    border: none;
    font-weight: 700;
    font-size: 1.4rem;
    cursor: pointer;
    color: #444;
}

.btn-submit {
    background-color: #FFD700;
    padding: 20px 70px;
    border: none;
    border-radius: 10px;
    font-weight: 800;
    font-size: 1.5rem;
    cursor: pointer;
    box-shadow: 0 8px 15px rgba(0,0,0,0.1);
}

.btn-submit:hover {
    background-color: #FFD700;
    box-shadow: 0 8px 15px rgba(0,0,0,0.2);
    transition: 0.3s;
}

.scroll-top-btn {
  position: fixed;
  bottom: 3rem;
  right: 3.5rem;
  width: 54px;
  height: 54px;
  border-radius: 50%;
  background-color: #EFBF04; /* Dark blue theme */
  border: none;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease;
  z-index: 9999; /* Ensures it stays above the form and header */
}

.scroll-top-btn:hover {
  opacity: 0.9;
  transform: translateY(-5px); /* Makes it pop up slightly on hover */
  background-color: #b39006; /* Slightly lighter blue for feedback */
}

/* Optional: Make the arrow color white specifically */
.scroll-top-btn svg {
  stroke: #000000;
}