*{margin:0;padding:0;box-sizing:border-box;}

body{
    font-family:'Poppins',sans-serif;
    
    color:#fff;
}

/* HEADER */
header{
    position:fixed; right:5%; left:5%;
    width:90%;
    top:0;
    padding:20px 60px;
    display:flex;
    justify-content:space-between;
    align-items:center;
    z-index:1000;
    transition:.4s; background: linear-gradient(to right, rgba(255, 255, 255, 0.9), rgba(255, 255, 255, 0.80));
}

header.scrolled{
    background:rgba(255,255,255,0.9);
    backdrop-filter:blur(10px);
}

/* LOGO */
.logo img{height:51px;}

/* NAV */
nav ul{
    display:flex;
    list-style:none;
    gap:35px;
}

nav ul li a{
    color:#000;
    text-decoration:none;
    font-size:14px;
    letter-spacing:1px;
    text-transform:uppercase;
}

/* RIGHT */
.header-right{
    display:flex;
    align-items:center;
    gap:20px;
}

.phone a{
    color:#008122;
    text-decoration:none;
    font-size:17px;
}

/* BUTTON */
.book-btn{
    padding:10px 22px; letter-spacing: 1px;
    border-radius:4px;
    border:1px solid rgba(255,255,255,0.4);
    color:#fff; background:linear-gradient(45deg,#8fcc00,#a9db2b);
    text-decoration:none;
    position:relative;
    overflow:hidden;
}

.book-btn:before{
    content:"";
    position:absolute;
    width:0%;
    height:100%;
    background:linear-gradient(45deg,#8fcc00,#a9db2b);
    left:0;top:0;
    transition:.4s;
    z-index:-1;
}

.book-btn:hover:before{width:100%;}
.book-btn:hover{color:#fff; background:#a6d728;}

/* HAMBURGER */
.menu-toggle{
    display:none;
    flex-direction:column;
    gap:5px;
    cursor:pointer;
}

.menu-toggle span{
    width:25px;
    height:2px;
    background:#fff;
}

/* MOBILE MENU */
.mobile-menu{
    position:fixed;
    top:0;
    right:-100%;
    width:280px;
    height:100%;
    background:rgba(10,15,25,0.98);
    backdrop-filter:blur(12px);
    display:flex;
    flex-direction:column;
    padding:100px 30px;
    gap:25px;
    transition:.4s;
    z-index:1000;
}

.mobile-menu.active{right:0;}

.mobile-menu a{
    color:#fff;
    text-decoration:none;
    font-size:16px;
}

.mobile-book{
    padding:12px;
    text-align:center;
    background:linear-gradient(135deg,#d4af37,#f7e7a1);
    color:#000 !important;
    border-radius:30px;
}

/* CLOSE BUTTON */
.menu-header{
    position:absolute;
    top:20px;
    right:25px;
}

.menu-close{
    font-size:32px;
    cursor:pointer;
}

/* HERO */
.hero{
    height:100vh;
    position:relative;
    overflow:hidden;
}

.slide{
    position:absolute;
    width:100%;
    height:100%;
    background-size:cover;
    background-position:center;
    opacity:0;
    transform:scale(1.1);
    transition:1s;
}

.slide.active{
    opacity:1;
    transform:scale(1);
}

/* SLIDE CAPTION */
.slide-caption{
      position:absolute;
    top:50%;
    left:8%;
    transform:translateY(-50%);
    max-width:600px;
}

.slide.active .slide-caption{
    opacity:1;
    transform:translateY(-50%);
}

.slide-caption-title{
 font-family:'Playfair Display',serif;
    font-size:50px;
    margin-bottom:20px;
}

.slide-caption p{
    font-size:21px;
    opacity:0.85;
}

/* OVERLAY */
.overlay{
    position:absolute;
    width:100%;
    height:100%;
    background: linear-gradient(to right, rgba(10, 15, 25, 0.9), rgba(10, 15, 25, 0.3));
}

/* ARROWS */
.arrow{
    position:absolute;
    top:50%;
    transform:translateY(-50%);
    font-size:28px;
    background:rgba(0,0,0,0.4);
    padding:10px;
    cursor:pointer;
    z-index:10;
}

.prev{left:20px;}
.next{right:20px;}

/* RESPONSIVE */
@media(max-width:991px){

    header{padding:20px;}

    nav{display:none;}

    .menu-toggle{display:flex;}

    .slide-caption{
        left:20px;
        right:20px;
    }

    .slide-caption h2{font-size:28px;}
}


/* SECTION WITH BACKGROUND */
.welcome-section {

   background:linear-gradient(rgba(255,255,255, 0.8), rgba(248, 249, 252, 0.9)), url(../images/beach.webp) center / cover no-repeat;
  padding: 60px 20px;
}

/* OVERLAY */
.welcome-section::before {
  content: "";
  position: absolute;
  inset: 0;
  background: none;
}

/* CONTENT */
.container {
  max-width: 1100px;
  margin: auto;
  position: relative;
  z-index: 2;
}

.welcome-box {
  background: rgba(255,255,255,0.95);
  padding: 50px;
  border-radius: 12px;
  box-shadow: 0 10px 40px rgba(0,0,0,0.2);
  text-align: center;
}

.htittle, .htittle a {
  color: #a6d728; font-weight:bold;
  letter-spacing: 2px;
  font-size: 18px;
  margin-bottom:7px;
}

h1 {
  font-family: 'Playfair Display', serif;
  font-size: 36px;
  margin-bottom: 20px;
  color: #0a2342;
}

.welcome-box p {
  color: #555;
  line-height: 1.8;
  font-size: 16px;
}

.welcome-box p a { color:#8fcc00; text-decoration:none;}

.highlight {
  font-weight: 500;
  color: #000; margin-bottom:25px;
}

/* READ MORE */
.read-more-content {
  max-height: 0;
  overflow: hidden;
  transition: max-height 0.6s ease;
}

.read-more-content.active {
  max-height: 300px;
  margin-top: 20px;
}

.read-btn {
  display: inline-block; font-family:'Poppins',sans-serif;
  margin-top: 25px;
  padding: 12px 30px;
  border: none;
  background: linear-gradient(45deg,#8fcc00,#a9db2b);
  color: #fff;
  font-size: 17px;
  letter-spacing: 1px;
  cursor: pointer;
  border-radius: 30px;
  transition: all 0.3s ease;
}

.read-btn:hover {
  background:#008122;
  transform: translateY(-3px);
}

/* RESPONSIVE */
@media(max-width:768px){
  .welcome-box {
    padding: 30px 20px;
  }

  .welcome-box h2 {
    font-size: 26px;
  }
}


/* SECTION */
.amenities-section{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  padding:80px 6%;
  background:#fff;
}

/* LEFT IMAGE */
.amenities-image{
  flex:2;
}

.amenities-image img{
  width:100%;
  height:520px;
  object-fit:cover;
  border-radius:10px;
}

/* RIGHT CONTENT */
.amenities-content{
  flex:2;
  padding:40px 60px;
}

/* SUBTITLE */
.sub-title{
  text-transform:uppercase;
  letter-spacing:2px;
  font-size:13px;
  color:#7b8a97;
  margin-bottom:10px;
}

/* MAIN TITLE */
.main-title{
  font-family:'Playfair Display', serif;
  font-size:41px;
  line-height:1.2;
  color:#3c3c3c;
  margin-bottom:40px;
}

/* GRID */
.amenities-grid{
  display:grid;
  grid-template-columns:repeat(2, 1fr);
  gap:30px 60px;
}

/* ITEM */
.amenity-item{
  display:flex;
  align-items:flex-start;
  gap:15px;
}

/* ICON */
.icon{
  font-size:26px;
  color:#6c8fa3;
  margin-top:4px;
}

/* TEXT */
.amenity-text-title{
  margin:0;
  font-size:17px;
  font-weight:500;
  color:#2f2f2f;
}

.amenity-text p{
  margin:5px 0 0;
  font-size:14px;
  color:#7a7a7a;
  line-height:1.6;
}

/* RESPONSIVE */
@media(max-width:992px){
  .amenities-section{
    flex-direction:column;
    padding:50px 20px;
  }

  .amenities-content{
    padding:30px 0;
  }

  .amenities-image img{
    height:350px;
  }

  .main-title{
    font-size:32px;
  }

  .amenities-grid{
    grid-template-columns:1fr;
  }
}

.lux-room-section{
    width:100%;
    padding:80px 5%;
    background:#f5f5f5;
    font-family:Arial,sans-serif;
}

.lux-room-wrapper{
    position:relative;
    overflow:hidden;
    min-height:500px;
}

.room-item{
    position:absolute;
    inset:0;
    opacity:0;
    visibility:hidden;
    transform:translateX(80px);
    transition:all 0.8s ease;
    
    display:grid;
    grid-template-columns:60% 40%;
    background:#fff;
    border-radius:20px;
    overflow:hidden;
    align-items:center;
    box-shadow:0 10px 30px rgba(0,0,0,0.08);
}

.room-item.active-room{
    opacity:1;
    visibility:visible;
    transform:translateX(0);
    z-index:2;
}

.room-img img{
    width:100%;
    height:500px;
    object-fit:cover;
    display:block;
}

.room-content{
    padding:60px;
    text-align:center;
}

.room-content span{
    font-size:13px;
    letter-spacing:3px;
    color:#888;
    text-transform:uppercase;
    display:block;
    margin-bottom:18px;
}

.room-content h2{
    font-size:42px; font-family:'Playfair Display', serif;
    color:#222;
    margin-bottom:20px;
    line-height:1.3;
}

.room-content p{
    color:#666; font-family:'Poppins',sans-serif;
    font-size:17px;
    line-height:1.8;
    margin-bottom:30px;
}

.room-content a{
    display:inline-block; font-family:'Poppins',sans-serif;
    color:#0077b6;
    text-decoration:none;
    font-weight:600;
    font-size:21px;
    transition:0.3s;
}

.room-content a:hover{
    letter-spacing:1px;
}

.room-navigation{
    display:flex;
    justify-content:center;
    gap:15px;
    margin-top:40px;
}

.room-navigation button{
    width:55px;
    height:55px;
    border:none;
    border-radius:50%;
    background:#005062;
    color:#fff;
    font-size:28px;
    cursor:pointer;
    transition:0.3s;
}

.room-navigation button:hover{
    background:#111;
    transform:scale(1.08);
}

@media(max-width:991px){

    .lux-room-wrapper{
        min-height:750px;
    }

    .room-item{
        grid-template-columns:1fr;
    }

    .room-img img{
        height:350px;
    }

    .room-content{
        padding:40px 30px;
    }

    .room-content h2{
        font-size:32px;
    }
}

@media(max-width:768px){

    .lux-room-section{
        padding:60px 20px;
    }

    .lux-room-wrapper{
        min-height:620px;
    }

    .room-img img{
        height:260px;
    }

    .room-content{
        padding:30px 20px;
    }

    .room-content h2{
        font-size:24px;
    }

    .room-content p{
        font-size:15px;
    }

    .room-navigation button{
        width:45px;
        height:45px;
        font-size:24px;
    }
}

.section-heading{
    text-align:center;
    max-width:800px;
    margin:auto auto 70px;
}

.section-heading span{
    display:inline-block;
    background:#a6d728;
    color:#fff;
    padding:8px 20px;
    border-radius:30px;
    font-size:14px;
    letter-spacing:1px;
    margin-bottom:18px;
}

.section-heading-title{
    font-size:48px; font-family:'Playfair Display', serif;
    color:#0a2342;
    margin-bottom:18px;
    font-weight:700;
}

.section-heading p{
    font-size:17px; font-family:'Poppins',sans-serif;
    line-height:1.8;
    color:#666;
}

.lux-attraction-section{
    padding:100px 6%;
    background:#005062;
    overflow:hidden;
}

.lux-attraction-heading{
    text-align:center;
    margin-bottom:60px;
}

.lux-attraction-heading span{
    display:inline-block;
    color:#5ecbff;
    font-size:15px;
    letter-spacing:2px;
    text-transform:uppercase;
    margin-bottom:15px;
}

.lux-attraction-heading-title{
    color:#fff; font-family:'Playfair Display', serif;
    font-size:52px;
    font-weight:700;
    margin-bottom:18px;
    line-height:1.2;
}

.lux-attraction-heading p{
    max-width:760px;
    margin:auto;
    color:#c9d4df;
    font-size:17px;
    line-height:1.8;
}

.lux-attraction-wrapper{
    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:30px;
}

.lux-attraction-card{
    position:relative;
    height:520px;
    border-radius:28px;
    overflow:hidden;
    cursor:pointer;
    transition:0.5s ease;
    box-shadow:0 15px 40px rgba(0,0,0,0.35);
}

.lux-attraction-card img{
    width:100%;
    height:100%;
    object-fit:cover;
    transition:0.8s ease;
}

.lux-card-overlay{
    position:absolute;
    inset:0;
    background:linear-gradient(to top,
    rgba(0,0,0,0.9) 10%,
    rgba(0,0,0,0.3) 45%,
    rgba(0,0,0,0.1) 100%);
}

.lux-card-content{
    position:absolute;
    left:35px;
    bottom:35px;
    z-index:2;
    transition:0.4s ease;
}

.lux-card-number{
    width:60px;
    height:60px;
    border-radius:50%;
    background:rgba(255,255,255,0.15);
    backdrop-filter:blur(10px);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:20px;
    font-weight:700;
    margin-bottom:25px;
    border:1px solid rgba(255,255,255,0.25);
}

.lux-card-content-title{
    color:#fff; font-family:'Playfair Display', serif;
    font-size:32px;
    margin-bottom:15px;
    line-height:1.3;
}

.lux-card-content p{
    color:#e2e8ef;
    font-size:16px;
    line-height:1.8;
    max-width:320px;
}

.lux-attraction-card:hover{
    transform:translateY(-12px);
}

.lux-attraction-card:hover img{
    transform:scale(1.12);
}

.lux-attraction-card:hover .lux-card-content{
    bottom:45px;
}

/* Tablet */
@media(max-width:991px){

    .lux-attraction-wrapper{
        grid-template-columns:1fr 1fr;
    }

    .lux-attraction-heading h2{
        font-size:40px;
    }

    .lux-attraction-card{
        height:450px;
    }
}

/* Mobile */
@media(max-width:767px){

    .lux-attraction-section{
        padding:70px 20px;
    }

    .lux-attraction-wrapper{
        grid-template-columns:1fr;
    }

    .lux-attraction-heading h2{
        font-size:30px;
    }

    .lux-attraction-heading p{
        font-size:15px;
    }

    .lux-attraction-card{
        height:400px;
        border-radius:22px;
    }

    .lux-card-content{
        left:25px;
        bottom:25px;
    }

    .lux-card-content h3{
        font-size:24px;
    }

    .lux-card-content p{
        font-size:14px;
        line-height:1.7;
    }

    .lux-card-number{
        width:50px;
        height:50px;
        font-size:17px;
    }
}

  /* FOOTER */
.footer {
   background:#005062; font-family:'Poppins',sans-serif;
    color: #fff;
    padding: 60px 0;
    color: #fff;
    padding: 60px 20px 20px;
    position: relative;
}



/* GRID LAYOUT */
.footer-container {
    position: relative;
    max-width: 1200px;
    margin: auto;
    display: grid;
    grid-template-columns: 40% 20% 40%;
    gap: 30px;
}

.ftitle, .ftitle a {
    margin-bottom: 15px; color:#fff; text-decoration:none;
    font-size: 23px; font-weight:lighter; font-family:'Playfair Display', serif;
}

.footer p,
.footer p a {
font-size: 16px;
    font-weight: normal;
    line-height:28px;
   color: #fff;
    margin-bottom: 8px;
    text-decoration: none;
    
}

/* Quick Links */
.footer-links a {
    display: block; text-decoration:none; color: #fff; 
    margin-bottom: 8px;
    transition: 0.3s;
}

.footer-links a::before {
    content: "→ ";
    color: #4da6ff;
}

.footer-links a:hover {
    color: #fff; text-decoration:none;
    transform: translateX(5px);
}

/* Social */
.social-icons {
    margin-top: 10px;
}

.social-icons a {
    display: inline-block;
    margin: 5px 8px 0 0;
    width: 36px; 
    height: 36px;   color: #fff;
    line-height: 36px;
    text-align: center;
    background: #5ecbff;
    border-radius: 50%;
    transition: 0.3s;
}

.social-icons a:hover {
    background: #a6d728;
    transform: translateY(-3px);
}

/* Logo */
.footer-logo img {
    max-width: 170px;
    margin-top: 15px;
    transition: 0.3s;
}

.footer-logo img:hover {
    transform: scale(1.05);
}

/* Bottom */
.footer-bottom {
    border-top: 1px solid rgba(255,255,255,0.2);
    margin-top: 40px;
    padding-top: 15px;
    text-align: center;
    font-size: 13px;
}

/* RESPONSIVE */
@media (max-width: 992px) {
    .footer-container {
        grid-template-columns: 1fr 1fr;
    }
}

@media (max-width: 576px) {
    .footer-container {
        grid-template-columns: 1fr;
        text-align: center;
    }
}

label {Display:none;}
.reserve { color:#008122; font-size:27px;  float:left;  font-weight:normal; text-align:left; padding:15px 12px; margin-right:26px; font-family: 'Segoe UI', sans-serif; font-weight:bold; font-family:'Playfair Display', serif;}
.imenu { width:74%;  margin:0 auto; padding:12px 15px; background: rgba(255,255,255,0.5); float:none; border-radius: 4px; box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1); font-family: 'Segoe UI', sans-serif;}
.check1{ margin:11px 10px; float:left; width:11%; font-weight:normal;}
.check2{ margin:10px 10px; float:left; width:11%; font-weight:normal;}
.chk {font-size:12px; color:#424669; line-height:24px;}
.message1{ font-size:14px; padding:10px 11px; margin:0 auto; border-bottom:#008122 solid 1px; color: #424669; border-radius: 4px; width:90%; font-weight:normal;  background:#f2f2f2; font-family: 'Segoe UI', sans-serif;}
.message2{ font-size:14px; padding:10px 11px; margin:0 auto; border-bottom:#008122 solid 1px; color: #424669; border-radius: 4px; width:90%; font-weight:normal;  background:#f2f2f2; font-family: 'Segoe UI', sans-serif;}

input[type="submit"]
.palace-button, input[type="submit"], input#searchsubmit { border-radius: 4px;
background:linear-gradient(45deg,#8fcc00,#a9db2b); border:none; color:#fff; font-size: 16px; font-family: 'Segoe UI', sans-serif; padding:10px 22px; font-weight:normal; letter-spacing:1px;}
::-webkit-input-placeholder {
   color: #333333;
}

:-moz-placeholder { /* Firefox 18- */
   color: #333333;  
}

::-moz-placeholder {  /* Firefox 19+ */
   color: #333333;  
}

:-ms-input-placeholder {  
   color: #333333;  
}
.map1{ font-size:12px;
padding:10px;  font-family: 'Segoe UI', sans-serif;
width:50%; 
margin-right:15px; background:#fff;
border: 1px double #929292;
color:#444;
float:left; border-radius: 20px;
}

.amenity1 {
      width:40%; float:left; 
      margin: 10px 10px 0 20px;
      padding: 20px; 
      
    }
  
    .amenity1 ul {
      list-style: none;
      padding: 0;
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
      gap: 15px 30px;
    }
    .amenity1 li {
      font-size: 17px;
      color: #3f4a56; padding:8px 0;
      display: flex;
      align-items: center; text-align:left;
    }
    .amenity1 li i {
       color: #3f4a56;
      margin-right: 10px;
      font-size: 18px;
      min-width: 20px;
      text-align: center;
    }
.amenity1-list li {
  position: relative;
  padding-left: 8px;
  margin-bottom: 10px;
}

.amenity1-list li::before {
  content: "";
  position: absolute;
  left: 0;
   color: #3f4a56; /* Blue checkmark */
  font-size: 17px;
}
.col1 {  width:40%; float:left; text-align:left; padding: 20px;  font-size: 17px;  color: #3f4a56; margin-left:30px; }
.col1 ul li {list-style:circle; line-height:36px;}
.col1 ul li a {color: #3f4a56; text-decoration:none; list-style:none;}	
 
 
 .att2 {
  max-width: 1200px;
  margin: 40px auto;
  padding: 0 15px;
}

.att2-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 30px;
}

.att2-card {
  background: #ffffff;
  border-radius: 2px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.1);
  display: flex;
  flex-direction: column;
  height: 100%;
}

.att2-img img {
  width: 100%;
  height: 360px;
  object-fit: cover;
}

.att2-content {
  padding: 22px;
  flex: 1;
  display: flex;
  flex-direction: column;
}

.title7 {
  font-size: 22px;
  margin-bottom: 12px;
  color: #1a1a1a;
}

.title3 {
  font-size: 23px;
  margin-bottom: 12px;
  color: #333; text-align:center;
}

.title8 {
    font-size:28px; font-family:'Playfair Display', serif;
    color:#0a2342;
    margin-bottom:18px;
    font-weight:700;
}

.att2-content p {
  font-size: 19px; text-align:Left;
  line-height: 1.7;
  color: #555;
}

/* Desktop 2-Column Layout */
@media (min-width: 768px) {
  .att2-grid {
    grid-template-columns: repeat(2, 1fr);
    align-items: stretch;
  }
}

.fq{text-align:left; text-decoration: none; color:#031C1A; font-weight:bold;  font-size:18px;  line-height:34px; margin-top:6px; list-style:none;}
.fqa{font-size:16px; color:#424242; font-weight:normal; line-height:28px; text-align:left;}
.fqa a{font-size:16px; color:#009245; text-decoration:none;}

.top2 { margin-top:8%;}


html {
    scroll-behavior: smooth;
  }

  #scrollTopBtn {
    position: fixed;
    bottom: 25px;
    right: 25px;
    width: 50px;
    height: 50px;
    border: none;
    outline: none;
    background: #a6d728;
    color: #fff;
    font-size: 22px;
    border-radius: 50%;
    cursor: pointer;
    display: none;
    z-index: 9999;
    box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
    transition: all 0.3s ease;
  }

  #scrollTopBtn:hover {
    background: #333;
    transform: translateY(-4px);
  }

  @media (max-width: 767px) {
    #scrollTopBtn {
      width: 45px;
      height: 45px;
      font-size: 20px;
      bottom: 20px;
      right: 20px;
    }
  }
  

.ada { width:100%; margin:0 auto; padding:12px 0; text-align:center; color:#666; font-size:17px; background:#F4F4F4; line-height:32px;}
.ada a { color:#666; text-decoration:none;}

.feature-box {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 40px 5px;
    gap: 60px;
    background: white;
    margin-bottom: 15px;
}

.feature-box.reverse {
    flex-direction: row-reverse;
}

.img-side {
    max-width: 45%;
}

.img-side img {
    width: 100%;
    max-width: 550px;
    height: 320px;
    object-fit: cover;
    border-radius: 12px;
}

.text-side {
    max-width: 50%;
}

.text-side h3 {
    font-size: 28px;
    margin-bottom: 10px;
}

.text-side p {
    font-size: 17px; 
    margin: 20px 0;     line-height: 1.8;
}



/* ----- MOBILE RESPONSIVE ----- */

@media (max-width: 768px) {
    .feature-box,
    .feature-box.reverse {
        flex-direction: column;
        text-align: center;
    }

    .img-side img {
        height: 250px;
    }
}