html, body {
overflow-x: hidden;
}

header,
.navbar,
.nav-container{
overflow: visible !important;
}

/*Contac Us */
/* Global */
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
    font-family: Arial, sans-serif;
}

.contact-page {
    background-image: url("BeachParty.jpg"); 
    background-size: cover;       
    background-position: center;  
    background-repeat: no-repeat; 
    background-attachment: fixed; 
}

/* Hide menu icon on desktop */
.menu-toggle{
display: none;
font-size: 22px;
cursor: pointer;
}

/* MOBILE */
/* MOBILE SETTINGS */
@media (max-width: 768px) {
    
    .nav-container {
        display: flex !important; /* Force flex */
        flex-direction: row !important;
        align-items: center;
        justify-content: space-between; /* Pushes items to edges */
        width: 100%;
        position: relative;
        padding: 10px 15px;
    }

    /* MENU TOGGLE -> LEFT */
    .menu-toggle {
        display: block !important;
        order: 1; /* Forces to the first position */
        flex: 1;  /* Occupies equal space to balance the logo */
        text-align: left;
    }

    /* CONTACT -> CENTER */
    .header-contact {
        order: 2;
        position: absolute;
        left: 50%;
        transform: translateX(-50%);
        white-space: nowrap;
        z-index: 10;
        text-align: center;
    }

    /* LOGO -> RIGHT */
    .logo {
        order: 3;
        flex: 1; /* Occupies equal space to balance the menu */
        text-align: right;
    }

    /* Reset any inherited centering */
    .nav-container * {
        margin: 0;
    }

    /* Hiding the desktop list */
    nav ul {
        display: none !important;
    }
}




/* HEADER */

.navbar{
position: sticky;
top: 0;
left: 0;
width: 100%;
z-index: 1000;
background: white;
box-shadow: 0 2px 10px rgba(0,0,0,0.08);

border-bottom: 4px solid;
border-image: linear-gradient(to right, #D4AF37, #2a5c8a, #D4AF37) 1;
}

.navbar{
display: block;
margin-bottom: 0;
}

.nav-container{
display: flex;
justify-content: space-between;
padding: 12px 8%;
position: relative;
}

.header-contact{
position: absolute;
left: 28%;  /* was 40% → now clearly moves LEFT */
transform: none;
font-size: 18px !important;
font-weight: 600;
color: #2a5c8a;
}

/* Center the contact number perfectly */
.header-contact::after {
display: none !important;
}

/* Right side nav */
nav{
margin-left: auto;
}

nav ul{
display: flex;
list-style: none;
gap: 30px;
}

nav ul li a{
position: relative; /* IMPORTANT for underline */
text-decoration: none;
color: #1b1b1b;
font-weight: 500;
font-size: 16px;
transition: 0.3s;
}

/* Hover */
.navbar a:hover {
color: #D4AF37;
}

.navbar a:hover::after {
width: 100%;
}

/* Active page highlight */
.navbar a.active {
color: #D4AF37;
}

.navbar a.active::after {
width: 100%;
}

/* LOCATION */
.location {
    text-align: center;
    padding: 40px 10%;
    margin-top: 87px;
}

.location h1 {
    margin-bottom: 20px;
    color: #0F3057;
}

.location iframe {
    width: 100%;
    height: 400px;
    border-radius: 12px;
}

/* CONTACT SECTION */
.contact-section {
    padding: 60px 10%;
}

.contact-container {
    display: flex;
    gap: 50px;
    flex-wrap: wrap;
}

/* LEFT SIDE */
.contact-info {
    flex: 1;
}

.contact-info div {
    display: flex;
    align-items: center;
    margin-bottom: 25px;
}

.contact-info i {
    font-size: 20px;
    color: hsl(244, 65%, 52%);
    margin-right: 15px;
}

.contact-info{
background: rgba(255, 255, 255, 0.95); /* slight transparency = premium look */
padding: 15px 18px;
border-radius: 10px;
box-shadow: 0 8px 25px rgba(0,0,0,0.15);
max-width: 400px;
background: rgba(255, 255, 255, 0.85);
backdrop-filter: blur(10px);

/* KEY FIX */
display: inline-flex;
flex-direction: column;
align-items: flex-start;
height: fit-content;
}

/* spacing inside */
.contact-info div{
display: flex;
align-items: flex-start;
gap: 15px;
margin-bottom: 20px;
}

/* icons styling */
.contact-info i{
font-size: 20px;
color: #2a5c8a;
margin-top: 5px;
}

/* text styling */
.contact-info h4{
margin: 0;
font-size: 16px;
color: #1b1b1b;
}

.contact-info p{
margin: 3px 0 0;
font-size: 14px;
color: #555;
}

/* RIGHT SIDE FORM */
.contact-form {
    flex: 1;
    background: white;
    padding: 30px;
    border-radius: 12px;

    background: rgba(255, 255, 255, 0.85);
    backdrop-filter: blur(10px);
}

.contact-form input,
.contact-form textarea {
    width: 100%;
    padding: 12px;
    margin-bottom: 15px;
    border: 1px solid #ccc;
    border-radius: 8px;
    outline: none;
}

.contact-form input:focus,
.contact-form textarea:focus {
    border-color: hsl(268, 65%, 52%);
}

.contact-form label {
    display: block;
    margin-bottom: 5px;
    font-weight: 600;
    color: #0F3057;
    font-size: 14px;
}

.contact-form input,
.contact-form textarea {
    margin-bottom: 20px;
}

.contact-form button {
    width: 100%;
    padding: 12px;
    border: none;
    background-color: #0F3057;
    color: white;
    font-weight: bold;
    border-radius: 8px;
    cursor: pointer;
    transition: 0.3s;
}

.contact-form button:hover {
    background-color: hwb(268 14% 35%);
    color: #0F3057;
}

#formMessage {
    margin-top: 10px;
    font-weight: bold;
}

/* FOOTER */

.footer{
background:#243f63;
color:white;
padding-top:60px;
}

.footer-container{
display:flex;
justify-content:space-between;
padding:0 8%;
gap:40px;
flex-wrap:wrap;
}

/* LEFT */

.footer-left h2{
font-size:26px;
margin-bottom:10px;
}

.footer-left p{
margin-bottom:20px;
}

.instagram {
    display: flex;
    align-items: center;
    gap: 10px;
    font-weight: 500;
}

/* ICON STYLE */
.instagram i {
    font-size: 30px;
    color: white;         
    transition: 0.3s ease;     
}

/* GLOW HOVER EFFECT */
.instagram i:hover {
    color: #FFC107; /* warmer gold */
    text-shadow: 
        0 0 5px #FFC107,
        0 0 10px #FFC107,
        0 0 20px #FFC107,
        0 0 40px #FF8C00;
}

/* CENTER */

footer{
padding: 20px 5%;
}

footer div{
max-width: 100%;
}

.footer-center{
display:flex;
flex-direction:column;
gap:15px;
}

.footer-info span{
font-size:12px;
opacity:0.7;
}

.footer-info p{
margin:3px 0;
}

footer a {
color: white !important;
text-decoration: none !important;
}

/* RIGHT */

.footer-right h4{
margin-bottom:10px;
}

.footer-right p{
margin-bottom:10px;
}

.footer-right input{
width:250px;
padding:12px;
border-radius:8px;
border:none;
margin-bottom:15px;
}

.footer-right button{
background:#4c7fa3;
color:white;
border:none;
padding:12px 20px;
border-radius:25px;
cursor:pointer;
font-size:14px;
}

/* BOTTOM */

.footer-bottom{
text-align:center;
padding:25px 0;
margin-top:40px;
border-top:1px solid rgba(255,255,255,0.2);
font-size:14px;
}

/* About Us */
/* ABOUT HERO SECTION */

.about-page{
    background-image: url("Mountain.jpg");
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
}

.about-page .whatsapp-float{
display:none;
}

.about-hero{
position:relative;
height:90vh;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:white;
margin-top: 87px;

/* Background Image */
background-image:url("Beach.jpg");
background-size:cover;
background-position:center;
background-repeat:no-repeat;


}


/* Dark overlay so text is readable */

.about-overlay{
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0, 0, 0, 0.45);
}


/* Content */

.about-content{
position:relative;
max-width:750px;
padding:20px;
animation:fadeUp 1.2s ease;
}

.about-content h1{
font-size:48px;
margin-bottom:20px;
}

.about-content p{
font-size:18px;
line-height:1.6;
margin-bottom:15px;
}

.about-btn{
display:inline-block;
margin-top:20px;
padding:12px 28px;
background:#ff7a18;
color:white;
text-decoration:none;
border-radius:25px;
font-weight:bold;
transition:0.3s;
}

.about-btn:hover{
background:#ff9c4a;
transform:scale(1.05);
}


/* FEATURES SECTION */

.about-features{
    padding: 80px 10%;
    text-align: center;

    /* Make background slightly transparent so mountain shows */
    background: rgba(255,255,255,0.85);

    backdrop-filter: blur(4px); /* optional premium blur */
    
    padding: 80px 10%;
    text-align: center;
    background: transparent;
    margin-bottom: 0;

}

.about-features h2{
font-size:36px;
margin-bottom:50px;
color: #0F3057; 
}

.feature-container{
display:flex;
gap:30px;
justify-content:center;
flex-wrap:wrap;
}

.feature-card{
background:#f9f9f9;
padding:30px;
border-radius:10px;
width:280px;
transition:0.4s;
}

.feature-card i{
font-size:40px;
color: #163c6b;
margin-bottom:15px;
}

.feature-card:hover{
transform:translateY(-8px);
box-shadow:0 10px 25px rgba(0,0,0,0.15);
}


/* ANIMATION */

@keyframes fadeUp{
from{
opacity:0;
transform:translateY(30px);
}
to{
opacity:1;
transform:translateY(0);
}
}


/* MOBILE RESPONSIVE */

@media(max-width:768px){

.about-content h1{
font-size:34px;
}

.about-content p{
font-size:16px;
}

.about-hero{
height:80vh;
}

.contact-page{
background-attachment: scroll;
}

}


@media(max-width:768px){

/* Fix header layout */
.nav-container {
display: flex !important;
align-items: center;
justify-content: space-between;
position: relative; /* Essential for the centered contact info */
width: 100%;
padding: 10px 15px;
box-sizing: border-box;
}

/* Reset contact positioning */
.header-contact {
order: 2;
position: absolute;
left: 55%;
transform: translateX(-50%);
white-space: nowrap;
z-index: 5;
text-align: center;
}

/* Stack nav links */
nav ul {
display: none !important;
}

/* SHOW ON CLICK */

nav ul.active{
display: flex !important;
flex-direction: column;
position: absolute;
top: 100%;
right: 5%;
background: white;
padding: 15px;
width: 200px;
box-shadow: 0 5px 15px rgba(0,0,0,0.1);
border-radius: 8px;
}
.menu-toggle {
display: block !important;
order: 3;
flex: 1; /* Balances the logo on the opposite side */
text-align: right;
cursor: pointer;
-webkit-tap-highlight-color: transparent;
outline: none;
}

a, button {
    -webkit-tap-highlight-color: transparent;
}

/* LOGO → LEFT */
.logo {
order: 1;
flex: 1; /* Gives it equal "weight" to help center the middle item */
display: flex;
justify-content: flex-start;
}

/* Prevent anything from overflowing */
body{
overflow-x: hidden;
}
}



/* NAVBAR */

.navbar{
position: sticky;
top: 0;
width: 100%;
background: white;
box-shadow: 0 2px 10px rgba(0,0,0,0.08);
z-index: 1000;
}

.nav-container{
display: flex;
align-items: center;
justify-content: space-between;
padding: 12px 8%;
}

.logo img{
height: 55px;
}

nav ul{
display: flex;
list-style: none;
gap: 30px;
}

nav ul li a{
text-decoration: none;
color: #1b1b1b;
font-weight: 500;
font-size: 16px;
transition: 0.3s;
}

nav ul li a:hover{
color: #2a5c8a;
}

.header-contact{
font-weight: 600;
color: #2a5c8a;
font-size: 15px;
}
/* HERO */

.hero{
height:90vh;
margin-top: 87px;
background:url("Kanyakumari.avif") center/cover no-repeat;
display:flex;
align-items:center;
justify-content:center;
text-align:center;
color:white;
position:relative;
}

.hero::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.45);
}

.hero-content{
position:relative;
z-index:2;
max-width:700px;
}

.hero-content h1{
font-size:50px;
margin-bottom:15px;
letter-spacing:1px;
}

.hero-content p{
font-size:18px;
margin-bottom:25px;
}

.hero-btn{
background:#0F3057;
padding:12px 28px;
color:white;
text-decoration:none;
border-radius:25px;
transition:0.3s;
}

.hero-btn:hover{
background:#174c85;
transform:scale(1.05);
}

/* HOME TITLES */

.section-title{
font-size:34px;
color:#0F3057;
font-weight:600;
margin-bottom:40px;
text-align:center;
font-family: Arial, sans-serif;
padding: 20px 10%;
}

/* DESTINATIONS */

.destinations{
padding:80px 10%;
text-align:center;
}

.destination-container{
display:flex;
gap:30px;
margin-top:40px;
overflow:hidden;
position:relative;
}

.destination-track{
display:flex;
gap:30px;
}

.destination-container::-webkit-scrollbar{
display:none;
}

.destination-card{
min-width:280px;
border-radius:10px;
overflow:hidden;
box-shadow:0 8px 20px rgba(0,0,0,0.1);
background:white;
flex-shrink:0;
transition:0.3s;
}

.destination-card img{
width:100%;
height:200px;
object-fit:cover;
}

.destination-card h3{
padding:15px;
color:#0F3057;
}

.destination-card:hover{
transform:translateY(-6px);
transition:0.3s;
}

/* OUR SERVICES */

.services{
padding:20px 10%;
text-align:center;
background:#f8fbff;
}

.service-container{
display:flex;
justify-content:center;
gap:25px;
margin-top:40px;
overflow:hidden;
}

.service-card{
width:230px;          /* increased width */
height:340px;         /* increased height */
background:white;
border-radius:12px;
overflow:hidden;
box-shadow:0 6px 15px rgba(0,0,0,0.1);
text-align:center;
transition:0.3s;
flex-shrink:0;

display:flex;         /* NEW */
flex-direction:column;/* NEW */
justify-content:space-between; /* NEW */
}

.service-card img{
width:100%;
height:120px;
object-fit:cover;
}

.service-card h3{
font-size:18px;
color:#0F3057;
margin-top:10px;
}

.service-card p{
font-size:13px;
color:#555;
padding:8px 15px;
line-height:1.5;
flex-grow:1; /* THIS pushes button to bottom cleanly */
}

.service-card:hover{
transform:translateY(-6px);
box-shadow:0 12px 25px rgba(0,0,0,0.15);
}

/* ENQUIRE BUTTON AND EXPLORE BUTTON */

/* COMMON STYLE FOR BOTH BUTTONS */

.enquire-btn,
.explore-btn{
display:inline-flex;
align-items:center;
justify-content:center;
gap:8px;

margin:12px auto 15px;
padding:8px 16px;

background:#0F3057;
color:white;

font-size:13px;
font-weight:600;

border-radius:6px;
text-decoration:none;

transition:0.3s ease;
}

/* ICON SIZE SAME */
.enquire-btn i,
.explore-btn i{
font-size:12px;
}

/* SAME HOVER EFFECT */
/* GLOW EFFECT FOR BOTH BUTTONS */

.enquire-btn:hover,
.explore-btn:hover{
background:#FFD700;
color:#0F3057;

transform:translateY(-2px);

/* THIS IS THE GLOW */
box-shadow:0 0 20px rgba(255,215,0,0.6),
           0 0 20px rgba(255,215,0,0.6),
           
}

/* DEFAULT GLOW (IDLE STATE) */

.enquire-btn,
.explore-btn{
box-shadow:0 0 8px rgba(255,215,0,0.25),
           0 0 16px rgba(255,215,0,0.15);
}

.service-card {
    display: flex;
    flex-direction: column;
    align-items: center; /* 👈 THIS FIXES IT */
}

.enquire-btn,
.explore-btn{
margin-top:auto;
}

/* FORCE BOTH BUTTONS TO LOOK IDENTICAL */

.enquire-btn,
.explore-btn{
display:inline-flex !important;
align-items:center !important;
justify-content:center !important;
gap:8px !important;

width:fit-content !important;

margin:12px auto 15px !important;
padding:8px 16px !important;

background:#0F3057 !important;
color:white !important;

font-size:13px !important;
font-weight:600 !important;

border-radius:6px !important;
text-decoration:none !important;

transition:0.3s ease !important;
}

/* ICON CONSISTENCY */
.enquire-btn i,
.explore-btn i{
font-size:12px !important;
}

/* SAME HOVER */
.enquire-btn:hover,
.explore-btn:hover{
background:#fab92c !important;
color:#0F3057 !important;
transform:translateY(-2px) !important;

box-shadow:0 0 20px rgba(255,215,0,0.6),
           0 0 20px rgba(255,215,0,0.4),
           0 6px 15px rgba(0,0,0,0.2);
}

/* FINAL BUTTON FIX */

.enquire-btn,
.explore-btn{
box-shadow:0 0 10px rgba(255,215,0,0.35),
           0 0 18px rgba(255,215,0,0.25) !important;
}

/* WHY US */

.why-us{
background:#f8fbff;
padding:40px 10%;
text-align:center;
}

.features{
display:flex;
justify-content:center;
gap:40px;
margin-top:40px;
}

.feature i{
font-size:40px;
color:#0F3057;
margin-bottom:15px;
}


/* REVIEWS */

.review-title{
margin-bottom:50px;
position:relative;
z-index:2;
}

.reviews-h2{
font-size: 30px;
color: #0F3057;
}

.reviews{
padding:30px 10%;
text-align:center;
background:#ffffff;
}

.review-carousel{
overflow:hidden;
}

.review-track{
display:flex;
gap:30px;
transition:transform 3s ease;
}

.review-card{
min-width:280px;
width:280px;
background:white;
padding:20px;
border-radius:10px;
box-shadow:0 8px 20px rgba(0,0,0,0.1);
flex-shrink:0;
}

.review-card img{
width:60px;
height:60px;
border-radius:50%;
object-fit:cover;
}

.stars{
color:gold;
margin:10px 0;
}


/* CTA */

.cta{
background:#0F3057;
color:white;
text-align:center;
padding:80px 10%;
display:flex;
flex-direction:column;
align-items:center;
gap:25px;
}

.cta h2{
font-size:32px;
}

.cta-btn{
background:white;
color:#0F3057;
padding:12px 28px;
text-decoration:none;
border-radius:25px;
font-weight:bold;
transition:0.3s;
}

.cta-btn:hover{
background:#e6f4ff;
transform:scale(1.05);
}


/* FOOTER */

footer{
background:#0F3057;
color:white;
text-align:center;
padding:15px;
}

/* FOOTER */

.footer{
background:#0F3057;
color:white;
padding:50px 10% 20px;
}

.footer-container{
display:flex;
justify-content:space-between;
flex-wrap:wrap;
gap:40px;
}

.footer-about{
max-width:300px;
}

.footer-links ul{
list-style:none;
}

.footer-links li{
margin:10px 0;
}

.footer-links a{
color:white;
text-decoration:none;
transition:0.3s;
}

.footer-links a:hover{
color:#ffd700;
}


/* SOCIAL ICONS */

.social-icons{
display:flex;
gap:15px;
margin-top:10px;
}

.social-icons a{
color:white;
font-size:22px;
transition:0.3s;
}

.social-icons a:hover{
color:#ffd700;
}


/* FOOTER BOTTOM */

.footer-bottom{
text-align:center;
width:100%;
margin-top:30px;
font-size:14px;
opacity:0.8;
}

.footer-bottom{
border-top:1px solid rgba(255,255,255,0.2);
padding-top:15px;
}

.footer-container{
display:grid;
grid-template-columns: 1fr 1fr 1fr;
align-items:start;
gap:40px;

max-width:1200px;   
margin:0 auto;      
padding:0 20px;     
}

.footer-about{
max-width:300px;
text-align:center;text-align:center;
max-width:350px;
margin:auto;

}

.footer-links{
text-align:left;
}

.footer-social{
text-align:right;
justify-self:end;
}

.whatsapp-float{
position:fixed;
bottom:25px;
right:25px;
background:#25D366;
color:white;
width:55px;
height:55px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-size:28px;
box-shadow:0 6px 15px rgba(0,0,0,0.25);
z-index:1000;
transition:0.3s;
}

.whatsapp-float{
position:fixed;
bottom:25px;
right:25px;
background:#25D366;
color:white;
font-size:26px;
width:60px;
height:60px;
display:flex;
align-items:center;
justify-content:center;
border-radius:50%;
text-decoration:none;
box-shadow:0 4px 15px rgba(0,0,0,0.3);
z-index:1000;
transition:0.3s;
}

/* hover effect */

.whatsapp-float:hover{
transform:scale(1.1);
box-shadow:0 6px 20px rgba(0,0,0,0.4);
}

/* pulse animation */

.whatsapp-float::before{
content:'';
position:absolute;
width:60px;
height:60px;
border-radius:50%;
background:#25D366;
opacity:0.6;
animation:pulse 2s infinite;
z-index:-1;
}

@keyframes pulse{
0%{
transform:scale(1);
opacity:0.6;
}
70%{
transform:scale(1.5);
opacity:0;
}
100%{
transform:scale(1);
opacity:0;
}
}

.social-icons{
display:flex;
justify-content:flex-end;
gap:29px;
margin-top:10px;
}

.social-icons a{
color:white;
font-size:26px;   /* increase this */
transition:0.3s;
}

/* Glow effect */

.social-icons a:hover{
color:#ffd700;
text-shadow:
0 0 5px #ffd700,
0 0 10px #ffd700,
0 0 20px #ffd700;
transform:scale(1.15);
}

.footer-links ul{
list-style:none;
padding:0;
}

.footer-links ul li{
margin:8px 0;
}

.footer-links ul li a{
color:white;
text-decoration:none;
transition:0.3s;
display:inline-block;
}

/* hover animation */

.footer-links ul li a:hover{
color:#ffd700;
transform:translateX(6px);
}

.footer h3{
color:#ffd700;
margin-bottom:12px;
}

.footer{
position:relative;
background:#163a5f;
color:white;
padding:60px 20px 20px;
}

.footer::before{
content:"";
position:absolute;
top:0;
left:0;
width:100%;
height:3px;
background:linear-gradient(
90deg,
#ffd700,
#00c6ff,
#ffd700
);
}

body{
font-family: Arial;
margin:0;
background:#f9f9f9;
}

/* TITLE */

.packages-title{
text-align:center;
padding:60px 20px;
color:#2a5c8a;
margin-top: 90px;
}

.packages-title h1{
font-size:40px;
margin-bottom:10px;
}

/* PACKAGE GRID */

.packages-container{
display:grid;
grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
gap:30px;

padding:40px 8%;
}

/* TARIFF DETAILS */

.tariff-details{
width: 60%;
margin:auto;
padding:70px 0;
}

.tariff-heading{
text-align:center;
color:#2a5c8a;
margin-top:10px;
margin-bottom:15px;
font-size:20px;
font-weight:600;
position:relative;
margin-top: 150px;
}

.table-container{
width:100%;
display:flex;
justify-content:center;
margin-top:10px;
margin-bottom:60px;
}

/* gradient line under titles */

.tariff-heading::after{

content:"";

display:block;

width:40px;
height:3px;

margin:12px auto 0;

background:linear-gradient(
90deg,
#2a5c8a,
#6fa3d2
);

border-radius:3px;

}

.tariff-text{
text-align:center;
max-width:900px;
margin:auto;
margin-bottom:20px;
line-height:1.7;
}

.tariff-table{
width:85%;
border-collapse:collapse;
margin:auto;
font-size:15px;
background:white;
border-radius:8px;
overflow:hidden;
box-shadow:0 4px 12px rgba(0,0,0,0.06);
}

.tariff-table th{
background:#2a5c8a;
color:white;
padding:14px;
text-align:center;
font-weight:600;
letter-spacing:0.3px;
}

.tariff-table td{
border:1px solid #dddddd;
padding:12px;
text-align:center;
}

.tariff-table tr:nth-child(even){
background:#f5f7fa;
}

.tariff-table:hover{
transform:translateY(-3px);
transition:0.3s ease;
box-shadow:0 8px 20px rgba(0,0,0,0.08);
}

.tariff-rules{
margin:40px auto;
max-width:900px;
line-height:1.8;
}

.extra-note{
text-align:center;
font-style:italic;
padding:14px;
background:#f7f9fc;
color:#555;
font-size:14px;
}

/* CARD */

.package-card{

background:white;

border-radius:12px;

overflow:hidden;

box-shadow:0 10px 25px rgba(0,0,0,0.1);

transition:0.4s;

}

.package-card:hover{

transform:translateY(-10px);

box-shadow:0 15px 35px rgba(0,0,0,0.2);

}

.package-card img{

width:100%;
height:200px;
object-fit:cover;

transition:transform 0.5s ease;

}

.package-card h3{

padding:15px;

font-size:22px;

}

.package-card p{

padding:0 15px 20px;

font-size:14px;

color:#555;

}

.popup-image-animate{

animation:imageExpand 0.6s ease;

}

@keyframes imageExpand{

from{
transform:scale(0.9);
opacity:0.6;
}

to{
transform:scale(1);
opacity:1;
}

}

/* BUTTON */

.explore-btn{

margin:15px;

padding:10px 20px;

border:none;

background:#ff6b3d;

color:white;

border-radius:30px;

cursor:pointer;

transition:0.3s;

}

.explore-btn:hover{

background:#ff3b00;

transform:scale(1.05);

}

/* FILTER BUTTONS */

.filter-buttons {
    text-align: center;
    margin: 20px 0 10px;
}

.filter-buttons button {
    margin: 8px;
    padding: 8px 18px;

    border: none;
    border-radius: 20px;

    background: #e6eef7;
    color: #2a5c8a;

    font-size: 13px;
    font-weight: 600;

    cursor: pointer;

    transition: all 0.3s ease;
}

/* ✨ HOVER GLOW */
.filter-buttons button:hover {
    background: #2a5c8a;
    color: white;

    transform: translateY(-2px) scale(1.05);

    box-shadow: 0 0 10px rgba(42,92,138,0.6),
                0 0 20px rgba(42,92,138,0.4);
}

/* 🔥 ACTIVE GLOW (SELECTED) */
.filter-buttons button.active {
    background: #2a5c8a;
    color: white;

    box-shadow: 0 0 12px rgba(42,92,138,0.8),
                0 0 25px rgba(42,92,138,0.6);
}

/* CLICK PRESS */
.filter-buttons button:active {
    transform: scale(0.92);
}


/* CARD IMPROVEMENTS (MORE PREMIUM LOOK) */

.package-card{
display:flex;
flex-direction:column;
justify-content:space-between;

min-height:340px; /* keeps cards uniform */
}

/* INITIAL STATE */
.package-card {
    opacity: 0;
    transform: translateY(40px);
    transition: all 0.3s ease;
}

/* WHEN VISIBLE */
.package-card.show {
    opacity: 1;
    transform: translateY(0);
}

.package-card h3{
padding:12px 15px 5px;
font-size:20px;
color:#0F3057;
}

.package-card p{
padding:0 15px;
font-size:13px;
line-height:1.5;
color:#666;
}

/* IMAGE HOVER ZOOM (subtle premium feel) */

.package-card:hover img{
transform:scale(1.08);
}

/* BUTTON ALIGNMENT FIX */

.explore-btn{
align-self:center;
margin:15px auto 20px;
}

/* MOBILE OPTIMIZATION */

@media(max-width:768px){

.packages-title h1{
font-size:28px;
}

.packages-container{
gap:20px;
padding:30px 5%;
}

.package-card img{
height:180px;
}

}

/* SMALL POLISH (OPTIONAL BUT 🔥) */

.package-card::after{
content:"";
display:block;
height:3px;
width:0%;
background:#ff6b3d;
transition:0.4s;
margin:auto;
border-radius:2px;
}

.package-card:hover::after{
width:60%;
}

/* ITINERARY MODAL */

.itinerary-modal{

display:none;

position:fixed;

top:0;
left:0;

width:100%;
height:100%;

background:rgba(0,0,0,0.45);

backdrop-filter:blur(6px);

overflow-y:auto;

z-index:999;

padding:140px 20px 40px;
transition:opacity 0.3s ease;

}

@keyframes fadeOverlay{

from{
opacity:0;
}

to{
opacity:1;
}

}

/* MAIN CARD */

.itinerary-card{

width:520px;

margin:auto;

background:white;

border-radius:16px;

overflow:hidden;

box-shadow:0 30px 70px rgba(0,0,0,0.35);

animation:popupSlide 0.5s ease;

position:relative;

}

@keyframes popupSlide{

from{
transform:translateY(40px) scale(0.95);
opacity:0;
}

to{
transform:translateY(0) scale(1);
opacity:1;
}

}

/* CLOSE BUTTON */

.close-itinerary{

position:absolute;

top:10px;
right:10px;

width:32px;
height:32px;

border:none;

border-radius:50%;

background:white;

font-size:18px;

display:flex;
align-items:center;
justify-content:center;

cursor:pointer;

box-shadow:0 4px 12px rgba(0,0,0,0.25);

z-index:5000;

transition:0.25s;

}

.close-itinerary:hover{

transform:scale(1.1);
background:#f2f2f2;

}

/* BANNER IMAGE */

.itinerary-banner{

width:100%;
height:200px;

object-fit:cover;

transform:scale(1.08);

animation:bannerReveal 1s ease forwards;

}

@keyframes bannerReveal{

from{
transform:scale(1.15);
opacity:0;
}

to{
transform:scale(1);
opacity:1;
}

}

.itinerary-hero{
    position: relative;
    width: 100%;
    height: 250px;
    overflow: hidden;
    border-radius: 10px;
}

.itinerary-banner{
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* TEXT OVER IMAGE */
.hero-title{
    position: absolute;
    bottom: 15px;
    left: 20px;

    color: white;
    font-size: 26px;
    font-weight: 700;

    background: rgba(0,0,0,0.4);
    padding: 6px 14px;
    border-radius: 6px;

    backdrop-filter: blur(4px);
}



/* TAB BUTTONS */

.timeline-buttons{

display:flex;

justify-content:center;

gap:12px;

padding:18px 15px;

background:#ffffff;

border-bottom:1px solid #eee;

}

.timeline-buttons button{

padding:8px 16px;

border:none;

background:#f2f4f8;

border-radius:8px;

cursor:pointer;

font-weight:500;

transition:0.25s;

}

.timeline-buttons button.active-plan{

background:#2a5c8a;

color:white;

transform:scale(1.05);

box-shadow:0 4px 12px rgba(0,0,0,0.15);

}

/* GRID LAYOUT */

.itinerary-grid{

display:grid;

grid-template-columns:1fr 1fr;

gap:20px;

padding:20px;

animation:slideItinerary 0.45s ease;

}

@keyframes slideItinerary{

from{

opacity:0;
transform:translateX(25px);

}

to{

opacity:1;
transform:translateX(0);

}



}

/* PANEL BOXES */

.itinerary-panel{

background:#f7f9fc;

padding:18px;

border-radius:10px;

box-shadow:0 6px 15px rgba(0,0,0,0.06);

transition:0.25s;

}

.itinerary-panel:hover{

transform:translateY(-3px);

}

.itinerary-panel h4{

margin-bottom:10px;

color:#2a5c8a;

font-size:16px;

}

.itinerary-panel ul{

padding-left:18px;

line-height:1.7;

font-size:14px;

}

/* ENQUIRE BUTTON */

.enquire-container{

padding:20px;

text-align:center;

}

.enquire-btn{

background:#ff6b3d;

border:none;

color:white;

padding:12px 30px;

border-radius:25px;

font-weight:600;

cursor:pointer;

transition:0.3s;

box-shadow:0 8px 20px rgba(255,107,61,0.4);

}

.enquire-btn:hover{

background:#ff3b00;

transform:translateY(-3px);

box-shadow:0 15px 30px rgba(255,107,61,0.5);

}

/* ENQUIRY POPUP */

.close-enquiry{

position:absolute;

top:12px;
right:15px;

font-size:20px;

cursor:pointer;

background:#f3f3f3;

width:28px;
height:28px;

display:flex;
align-items:center;
justify-content:center;

border-radius:50%;

transition:0.3s;

}

.close-enquiry:hover{

background:#ddd;

}

.enquiry-popup{
z-index:2000;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
display:none;
justify-content:center;
align-items:center;
}

.enquiry-box{

position:relative;

background:white;

padding:35px;

border-radius:12px;

width:350px;

display:flex;

flex-direction:column;

gap:15px;

animation:enquiryPop 0.35s ease;

}

@keyframes enquiryPop{

from{
transform:scale(0.9);
opacity:0;
}

to{
transform:scale(1);
opacity:1;
}

}

.enquiry-box input{
padding:12px;
border:1px solid #ccc;
border-radius:6px;
}

.enquiry-actions{
display:flex;
justify-content:flex-end;
gap:10px;
}

.submit-btn{
background:#2a5c8a;
color:white;
border:none;
padding:10px 18px;
border-radius:6px;
display: block;
margin: 15px auto 0;
}

/* ANIMATIONS */

@keyframes fadeIn{
from{opacity:0}
to{opacity:1}
}

@keyframes slideUp{
from{transform:translateY(15px);opacity:0}
to{transform:translateY(0);opacity:1}
}

.filter-buttons{
text-align:center;
margin-top:30px;
}

.filter-buttons button{
margin:6px;
padding:10px 18px;
border:none;
background:#2a5c8a;
color:white;
border-radius:25px;
cursor:pointer;
transition:0.3s;
}

.filter-buttons button:hover{
background:#ff6b3d;
}

/* TITLE */

.tariff-heading{
font-size:40px;
text-align:center;
margin-bottom:0px;
color:#2a5c8a;
}

.tariff-title p{
color:#555;
max-width:750px;
margin:0 auto;
line-height:1.6;
text-align: center;
}

.tariff-details{
width:70%;
margin: 0 auto;
}

.tariff-text{
text-align:center;
max-width:900px;
margin:0 auto 40px auto;
line-height:1.7;
color:#444;
font-size: 70px;
}


/* TABLE SECTION */

.tariff-section{

padding:40px 8%;

display:flex;

justify-content:center;

}


/* TABLE STYLE */

table{
width: 100%;
border-collapse:collapse;
text-align:center;
margin:40px auto;
max-width:900px;
line-height:1.8;

}

thead{

background:#2a5c8a;
color:white;
padding:14px;
text-align:center;
font-weight:600;
letter-spacing:0.3px;

}

th{
font-size:18px;
border:1px solid #dddddd;
padding:14px;
text-align:center;
}

td{
border:1px solid #dddddd;
padding:14px;
text-align:center;
transition:0.3s;
}

.table-container table{
border-radius:10px;
overflow:hidden;
}

/* HOVER EFFECT */

.tariff-table tr{
transition:background 0.3s ease;
}

.tariff-table tr:hover{
background:#eef4fb;
}



/* CTA */

.cta{

text-align:center;

padding:60px 20px;

}

.cta-btn{

display:inline-block;

padding:12px 25px;

background:#ff6b3d;

color:white;

text-decoration:none;

border-radius:30px;

transition:0.3s;

}

.cta-btn:hover{

background:#ff3b00;

transform:scale(1.05);

}

body{
animation:pageFade 0.8s ease;
}

@keyframes pageFade{

from{
opacity:0;
transform:translateY(15px);
}

to{
opacity:1;
transform:translateY(0);
}

}

/* PREMIUM TABLE STYLE */

.tariff-table{
width:85%;
border-collapse:collapse;
margin:auto;
font-size:15px;
background:rgba(255,255,255,0.95);
border-radius:10px;
overflow:hidden;

box-shadow:
0 6px 20px rgba(0,0,0,0.06),
0 2px 6px rgba(0,0,0,0.05);

backdrop-filter: blur(6px);
transition:all 0.35s ease;
}

/* row hover */

.tariff-table tr{
transition:background 0.3s ease;
}

.tariff-table tr:hover{
background:#f2f7fd;
}

/* table lift */

.tariff-table:hover{
transform:translateY(-4px);
box-shadow:
0 12px 28px rgba(0,0,0,0.08),
0 4px 10px rgba(0,0,0,0.05);
}

/* SCROLL ANIMATION */

.reveal{
transform:translateY(40px);
transition:all 0.9s ease;
}

.reveal.active{
opacity:1;
transform:translateY(0);
}

.navbar {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    z-index: 9999 !important; /* Forces it above all other elements */
}