/* ================= FONTS ================= */

@font-face{
font-family:"Neue Montreal";
src:url("./Website-fonts/Neue_Montreal/NeueMontreal-Regular.otf") format("opentype");
font-weight:400;
}

@font-face{
font-family:"Neue Montreal";
src:url("./Website-fonts/Neue_Montreal/NeueMontreal-Bold.otf") format("opentype");
font-weight:700;
}

@font-face{
font-family:"Darker Grotesque";
src:url("./Website-fonts/Darker_Grotesque/DarkerGrotesque-VariableFont_wght.ttf") format("truetype");
}

@font-face{
font-family:"Inter";
src:url("./Website-fonts/Inter/Inter-VariableFont_opsz,wght.ttf") format("truetype");
font-weight:100 900;
}

/* ================= GLOBAL ================= */

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

body{
font-family:"Inter",sans-serif;
background:#f4f4f4;
color:#333;
}

/* ================= HERO ================= */

.hero{
background:url(unsplash_Pf-rTGteWyc.webp) center center / cover no-repeat;
background-attachment:scroll;
background-size:cover;
display:flex;
flex-direction:column;
}

.overlay{
background:linear-gradient(to right, rgba(0,0,0,.4), rgba(0,0,0,.2));
padding:2px 40px 40px;
display:flex;
flex-direction:column;
min-height:100%;
}


.nav{
display:flex;
justify-content:space-between;
align-items:center;
}

.call-btn{
display:flex;
align-items:center;
gap:8px;

padding:8px 18px;

border:2px solid #163c7a;
border-radius:40px;

color:#163c7a;
font-family:"Inter", sans-serif;
font-size:16px;
font-weight:600;

text-decoration:none;
background:white;
transition:0.2s;
}

.call-btn i{
font-size:14px;
}

.call-btn i{
font-size:18px;
}

.call-btn:hover{
background:#163c7a;
color:white;
}

.logo{
height:clamp(60px,6vw,110px);
}

/* HERO LAYOUT */

.hero-container{
display:flex;
justify-content:space-between;
align-items:center;
gap:40px;
flex-wrap:wrap;
}


/* HERO TEXT */

.hero-text{
display:flex;
position:relative;
z-index:3;
flex-direction:column;
gap:clamp(0px,0.15vw,3px);
justify-content:center;

}

.hero-title,
.hero-subtitle{
opacity:0;
transform:translateY(40px);
animation:fadeRise 0.9s cubic-bezier(.22,.61,.36,1) forwards;
}

.hero-subtitle{
animation-delay:0.4s;
}


@keyframes fadeRise{

0%{
opacity:0;
transform:translateY(25px);
}

100%{
opacity:1;
transform:translateY(0);
}

}

.hero-text h1{
font-family:"Neue Montreal", sans-serif;
font-size:clamp(48px,9vw,128px);
color:white;
text-shadow:0 4px 12px rgba(0,0,0,0.45);
line-height:0.85;
margin-top:0;
}

.hero-text h2{
font-family:"Darker Grotesque", sans-serif;
font-size:clamp(36px,7vw,96px);
color:#FCFF59;
text-shadow:0 4px 12px rgba(0,0,0,0.45);
line-height:0.85;
}

.hero-trust{

margin-top:8px;
font-family:"Darker Grotesque",sans-serif;
font-size:25px;
font-weight:500;
color:white;
opacity:0;
text-shadow:0 4px 12px rgba(0,0,0,0.45);
transform:translateY(25px);
animation:fadeRise 0.9s cubic-bezier(.22,.61,.36,1) forwards;
animation-delay:0.7s;

}

.heli-emoji{
display:inline-block;
margin-right:8px;

animation:
heliHover 3s ease-in-out infinite,
heliRotor 0.18s linear infinite;

will-change:transform;
}

@keyframes heliHover{

0%{
transform:translate(0,0) rotate(0deg);
}

50%{
transform:translate(6px,-3px) rotate(-4deg);
}

100%{
transform:translate(0,0) rotate(0deg);
}

}

@keyframes heliRotor{

0%{ filter:brightness(1); }

50%{ filter:brightness(1.1); }

100%{ filter:brightness(1); }

}


/* ================= FORM ================= */

.lead-form-iframe{
width:clamp(420px,32vw,520px);
background:transparent;
padding:0;
}

.lead-form-iframe iframe{
width:100%;
border:none;
display:block;
height:720px; 
}

/* ================= PACKAGES ================= */

.packages{
padding:30px 20px 40px;
background:#ffffff;
}

.package-grid{
display:flex;
gap:25px;
max-width:1200px;
margin:auto;
justify-content:space-between;
}

.package-card{
width:501px;
border-radius:40px;
overflow:hidden;
box-shadow:0 2px 5px rgba(0,0,0,0.15);
}

/* IMAGE */

.package-image{
height:260px;
overflow:hidden;
position:relative;
}

.package-image img{
width:100%;
height:100%;
object-fit:cover;
transition:0.4s ease;
image-rendering:auto;
}

.package-card:hover .package-image img{
transform:scale(1.05);
}

/* BADGE */

.badge{
position:absolute;
top:0;
right:0;
background:#FFC130;
padding:5px 17px 5px 10px;
font-family:"Darker Grotesque";
font-weight:bold;
font-size:15px;
border-bottom-left-radius:10px;
}

/* CONTENT */

.package-content{
background:white;
padding:12px 24px;
}

.package-header{
display:flex;
justify-content:space-between;
align-items:center;
min-height:32px;
}

.package-1 .package-header h2{
font-family:"Darker Grotesque";
font-size:20px;
color:#4A672B;
}

.package-2 .package-header h2{
font-family:"Darker Grotesque";
font-size:20px;
color:#0043AF;
}

.package-3 .package-header h2{
font-family:"Darker Grotesque";
font-size:20px;
color:#78504E;
}

.package-type{
color:white;
padding:8px 12px;
font-size:11px;
white-space:nowrap;
border-radius:4px;
font-weight:500;
}

/* different colors */

.package-green{
background:#4A672B;
}

.package-blue{
background:#2581F0;
}

.package-content h3{
margin-top:5px;
font-size:15px;
font-weight:600;
}

.package-content hr{
margin:10px 0;
border:none;
border-top:1px solid #ccc;
}

.departure,
.places{
font-size:15px;
margin-bottom:8px;
}

.card-footer{
display:flex;
justify-content:flex-end;
}

.quote-btn{
background:#163c7a;
text-decoration:none;   /* 🔥 this removes underline */
display:inline-block;   /* ensures proper button behavior */
color:white;
border:none;
padding:12px 16px;
border-radius:20px;
font-family:"Inter",sans-serif;
font-size:15px;
font-weight:600;
cursor:pointer;
transition:all .25s ease;
}

.quote-btn:hover{
transform:translateY(-3px);
box-shadow:0 2px 5px rgba(0,0,0,0.15);
background:#0f2c5c;
}

/* ================= TESTIMONIALS ================= */

.testimonials{
padding:40px 20px 60px;
text-align:center;
overflow:hidden;
}

.test-slider{
overflow:hidden;
margin-top:30px;
position:relative;
padding:20px 0;
}

.test-grid{
display:flex;
gap:25px;
animation:scrollTestimonials 35s linear infinite;
}

.test-grid:hover{
animation-play-state:paused;
}

.test{
flex:0 0 auto;
width:280px;
background:white;
padding:22px;
border-radius:14px;
box-shadow:0 2px 5px rgba(0,0,0,0.15);
text-align:center;
transition:transform .3s ease, box-shadow .3s ease;
}

.test:hover{
transform:translateY(-6px);
box-shadow:0 16px 35px rgba(0,0,0,0.12);
}

.test img{
width:70px;
height:70px;
border-radius:50%;
margin-bottom:12px;
object-fit:cover;
border:3px solid white;

}

.stars{
color:#f5b301;
font-size:16px;
letter-spacing:2px;
margin-bottom:8px;
}

/* REVIEW PREVIEW */

.review{
display:-webkit-box;
-webkit-line-clamp:3;
-webkit-box-orient:vertical;
overflow:hidden;

font-size:14px;
line-height:1.6;
color:#555;
}

/* READ MORE */

.read-more{
display:inline-block;
margin-top:4px;
color:#0047ff;
cursor:pointer;
font-weight:500;
font-size:13px;
}


/* REVIEWER NAME */

.reviewer{
display:block;
margin-top:14px;
font-weight:600;
font-size:15px;
color:#222;
}

.reviewer::before{
content:"— ";
color:#bbb;
}

/* SMOOTH INFINITE SCROLL */

@keyframes scrollTestimonials{

0%{
transform:translateX(0);
}

100%{
transform:translateX(-50%);
}

}


/* ================= MODAL ================= */

.modal{
display:none;
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
background:rgba(0,0,0,0.6);
justify-content:center;
align-items:center;
z-index:999;
}

.modal-content{

background:white;
padding:30px;

width:90%;
max-width:520px;
font-family:"Inter", sans-serif;
max-height:80vh;
overflow-y:auto;

border-radius:12px;
text-align:left;

}

.close-modal{
background:#0047ff;
color:white;
border:none;
padding:8px 16px;
border-radius:6px;
cursor:pointer;
margin-bottom:15px;
}

/* ================= WIDGET ================= */

/* CONTACT OPTIONS */

.contact-menu{
display:flex;
flex-direction:column-reverse;
gap:10px;

opacity:0;
transform:translateY(10px);

margin-bottom:10px;

pointer-events:none;
transition:0.3s;
}
.contact-menu.show{
opacity:1;
transform:translateY(0);
pointer-events:auto;
}

/* BUTTON STYLE */

.contact-item{
display:flex;
align-items:center;
gap:10px;
padding:12px 18px;
border-radius:30px;
color:white;
text-decoration:none;
font-family:"Inter",sans-serif;
font-size:14px;
box-shadow:0 4px 12px rgba(0,0,0,0.25);
}



.contact-item i{
font-size:16px;
}

/* MAIN BUTTON */

.contact-toggle{
width:60px;
height:60px;
border-radius:50%;
border:none;
background:#2c2c7a;
color:white;
font-size:22px;
cursor:pointer;
box-shadow:0 6px 16px rgba(0,0,0,0.3);
}

/* SCROLL BUTTON */

.scroll-top{

position:fixed;

bottom:25px;
right:calc(25px + 60px + 12px);

width:50px;
height:50px;

border:none;
border-radius:50%;

background:#a00000;
color:white;

font-size:18px;

cursor:pointer;

box-shadow:0 6px 16px rgba(0,0,0,0.3);

z-index:9999;

}



/* =========================
   CONTACT WIDGET
========================= */

.contact-widget{
position:fixed;
right:25px;
bottom:25px;
width:60px;
z-index:9999;
}


/* MAIN BUTTON */

.contact-main{
width:60px;
height:60px;
position:relative;
border-radius:50%;
border:none;
background:#2c2c7a;
color:white;
font-size:22px;
cursor:pointer;
box-shadow:0 6px 16px rgba(0,0,0,0.3);
transition:0.3s ease;
}

.contact-main.active{

background:#163c7a;

transform:rotate(135deg);

transition:0.3s ease;

}

/* OPTIONS */

.contact-options{

position:absolute;
bottom:70px;
left:0;
width:60px;

display:flex;
flex-direction:column;
align-items:center;

gap:12px;

opacity:0;
transform:translateY(15px);

pointer-events:none;
transition:0.25s ease;

}

.contact-options.show{
opacity:1;
transform:translateY(0);
pointer-events:auto;
}



/* OPTION BUTTONS */

.option{

width:50px;
height:50px;

border-radius:50%;

display:flex;
align-items:center;
justify-content:center;

color:white;

font-size:18px;

text-decoration:none;

box-shadow:0 4px 12px rgba(0,0,0,0.25);

}

.whatsapp i{
font-size:22px;
}


/* COLORS */

.call{
background:#1e88e5;
}

.whatsapp{
background:#25D366;
}

.query{
background:#ff9800;
}

.trust-strip{

display:flex;
justify-content:center;
align-items:center;

gap:40px;
flex-wrap:wrap;

padding:20px;

background:#f8f8f8;

border-top:1px solid #e5e5e5;
border-bottom:1px solid #e5e5e5;

}

.trust-item{

display:flex;
align-items:center;
gap:8px;

font-family:"Inter",sans-serif;
font-size:14px;
color:#333;

}

.trust-item i{

color:#163c7a;
font-size:18px;

}

.contact{
text-align:center;
padding:30px 20px;
background:#ffffff;
border-top:1px solid #e5e5e5;
}

.contact p{
font-weight:500;
font-size:15px;
color:#333;
letter-spacing:0.6px;
}

/* ================= FOOTER NAV FIX ================= */

.contact nav{
margin-top:12px;

display:flex;
justify-content:center;
align-items:center;
gap:30px;
flex-wrap:wrap;
}

/* links */

.contact nav a{
text-decoration:none;
color:#163c7a;

font-family:"Inter", sans-serif;
font-size:14px;
font-weight:500;

position:relative;
transition:0.25s ease;
}

/* subtle underline animation */

.contact nav a::after{
content:"";
position:absolute;
left:0;
bottom:-4px;

width:0%;
height:2px;

background:#163c7a;
transition:0.25s ease;
}

.contact nav a:hover::after{
width:100%;
}

.contact nav a:hover{
color:#0f2c5c;
}


/* ================= MOBILE ================= */

@media(max-width:900px){
	
.overlay{
padding:10px 16px 20px;
}

.nav{
flex-wrap:nowrap; 
justify-content:space-between;
align-items:center;
}

.hero-container{
flex-direction:column;
align-items:center;
justify-content:center;
gap:15px;
min-height:auto; 
}

.lead-form-iframe{
width:100%;
margin-top:20px;
}

.lead-form-iframe iframe{
height:715px;
overflow:hidden;
}

.hero{
background-position:center top;
min-height:auto;
}

.hero-text{
margin-top:20px;
}

.hero-text h1{
font-size:clamp(40px,10vw,50px);

}

.hero-text h2{
font-size:clamp(30px,8vw,40px);
}

.hero-trust{
font-size:14px;
margin-top:6px;
}

.heli-emoji{
font-size:16px;
margin-right:6px;
}

.package-grid{
flex-direction:column;
flex-wrap:wrap;
align-items:center;
}

.package-card{
width:100%;
max-width:500px;
}

.test-grid{
animation:none;
flex-direction:column;
align-items:center;
}

.scroll-top{
left:20px;
right:auto;
bottom:25px;
}

.trust-strip{
gap:15px;
font-size:13px;
}

.trust-item{
flex-direction:row;
}

.modal-content{
width:92%;
padding:22px;
max-height:75vh;
}

.modal{
padding:20px;
}

}