:root{
  /* brand */
  --navy:#14204f;        --navy-rgb:20,32,79;
  --yellow:#fcc00f;      --yellow-rgb:252,192,15;
  --yellow-soft:#fff4cc;
  --yellow-dark:#e8a800;
  --cta:#ee3359;         --cta-rgb:238,51,89;
  --cta-hover:#d62a4d;

  /* whatsapp */
  --whatsapp:#25d366;    --whatsapp-rgb:37,211,102;
  --whatsapp-hover:#1ebe5a;

  /* neutrals */
  --white:#fff;          --white-rgb:255,255,255;
  --black-rgb:0,0,0;
  --bg:#f9f9fa;
  --text:#122046;
  --muted:#454C61;
  --input-bg:#f6f7f9;
  --border:#dde0e8;
  --border-light:#e6e8ee;
  --frame:#d9d9dc;
  --ph-from:#c9ced9;
  --ph-to:#9aa3b8;

  /* form states */
  --error:#e03a3a;
  --error-bg:#fff6f6;
  --error-soft:#fdeaea;
  --error-dark:#b42323;
  --success:#1b7a3a;
  --success-bg:#e7f8ec;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-padding-top:calc(var(--header-h,64px) - 1px)} /* = sticky header height (set by script.js) */
body{font-family:'Open Sans',Arial,sans-serif;color:var(--text);line-height:1.3;overflow-x:hidden}
h1,h2,h3,.logo{font-family:Rajdhani,'Open Sans',sans-serif;text-transform:uppercase;color:var(--navy);letter-spacing:.5px}
a{text-decoration:none;color:inherit}
img{display:block;width:100%;height:100%;object-fit:cover}
.ph{background:linear-gradient(135deg,var(--ph-from),var(--ph-to))}
.wrap{max-width:1250px;margin:0 auto;padding:0 20px}

/* header */
header{display:flex;justify-content:space-between;align-items:center;padding:12px 24px;background:var(--bg)}
.logo{font-size:30px;font-weight:700;color:var(--navy);display:flex;align-items:center}
.logo a{display:inline-block;line-height:0}
.logo img{width:auto;height:40px;max-width:160px;object-fit:contain}
nav{display:flex;gap:6px;align-items:center;font-size:14px}
nav a{padding:8px 16px;border-radius:3px;color:var(--navy)}
nav a.active{background:var(--yellow);font-weight:700}
nav a.nav-cta,nav a.nav-cta.active{background:var(--cta);color:var(--white);font-weight:700;box-shadow:0 4px 12px rgba(var(--cta-rgb),.3)}
nav a.nav-cta:hover{background:var(--cta-hover)}

/* mobile menu toggle */
.menu-toggle{display:none;flex-direction:column;justify-content:center;align-items:center;gap:5px;width:40px;height:40px;background:none;border:0;cursor:pointer}
.menu-toggle span{width:24px;height:2px;background:var(--navy);transition:transform .3s,opacity .3s}
.menu-toggle.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.menu-toggle.open span:nth-child(2){opacity:0}
.menu-toggle.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}

/* buttons / pills */
.btn{display:inline-flex;background:var(--yellow);color:var(--navy);font-weight:700;font-size:18px;padding:16px 24px;border-radius:4px;align-items:center;gap:8px}
.btn.outline{background:transparent;color:var(--white);border:1px solid rgba(var(--white-rgb),.5)}
.btn.sm{font-size:12px;padding:8px 16px;border-radius:4px}
.pill{display:inline-flex;align-items:center;gap:8px;background:var(--yellow-soft);color:var(--yellow-dark);font-size:16px;font-weight:700;padding:8px 16px;border-radius:20px;text-transform:uppercase}
.pill::before{content:"";width:20px;height:1px;background:var(--yellow-dark)}

/* hero */
.hero{background:var(--navy);padding:90px 0}
.hero .wrap{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:40px}
.hero h1{color:var(--white);font-size:56px;line-height:1.1;font-weight:700}
.hero .pill{margin-bottom:16px}
.hero h1 em{color:var(--yellow);font-style:normal}
.hero p{color:var(--white);font-size:18px;max-width:460px;margin:20px 0 40px 0}
.hero .btns{display:flex;gap:20px;flex-wrap:wrap}
.hero-card{position:relative;border:16px solid var(--frame);border-radius:32px;overflow:hidden;height:500px;margin-top:-40px;margin-bottom:-45px;max-width:580px;justify-self:end;width:100%}
.tag{position:absolute;top:16px;background:var(--white);color:var(--navy);font-size:12px;font-weight:600;padding:8px 12px;border-radius:20px}
.tag.dark{background:var(--navy);color:var(--white)}
.tag::before{content:"";display:inline-block;width:10px;height:10px;border-radius:50%;background:var(--yellow);margin-right:6px}
.tag.dark.nodot::before{display:none}
.hero-note{position:absolute;left:16px;bottom:16px;width:300px;background:var(--navy);color:var(--white);border-radius:10px;padding:16px;font-size:16px}
.hero-note b{display:block;color:var(--yellow);text-transform:uppercase;margin-bottom:4px;font-size:18px}
.hero .our-services-btn svg{fill:currentColor}
.hero .our-services-btn:hover svg{fill:currentColor}

/* about */
.about{padding:100px 0}
.about .wrap{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center}
.about-img{position:relative;height:545px;border-radius:14px;overflow:hidden}
.about-img .tag{left:16px}
.about-card{position:absolute;right:-60px;bottom:24px;width:340px;background:var(--white);border-radius:10px;padding:16px;box-shadow:0 10px 30px rgba(var(--black-rgb),.12)}
.about-wrapper{position:relative}
.about-card .mini{height:110px;border-radius:8px;overflow:hidden;margin:20px 0}
.about-card h4{font-size:18px;color:var(--navy);text-transform:uppercase}
.about-card p{font-size:16px !important;color:var(--muted)}
.about-card .row{display:flex;justify-content:space-between;font-size:11px;font-weight:700;color:var(--navy)}
.about h2{font-size:52px;line-height:1;margin:20px 0}
.about p{font-size:18px;color:var(--muted);margin-bottom:18px}
.abou-card-mini-tag{position:static;background:var(--yellow);color:var(--navy);font-size:12px;font-weight:700;padding:6px 12px;border-radius:20px;display:flex;align-items:center}

/* sections */
.sec{padding:100px 0;background:var(--bg)}
#offer.sec{background:var(--white)}
#faq.sec{background:var(--bg)}
.sec h2{font-size:52px;margin:20px 0;line-height:1}
.sec>.wrap>p{font-size:18px;color:var(--muted)}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:50px;align-items:start}

/* services */
.svc{position:relative;height:auto;background:none}
.svc-media{height:480px;border-radius:14px;overflow:hidden;background:linear-gradient(135deg,var(--ph-from),var(--ph-to))}
.svc .tag{left:16px;z-index:2}
.svc .tag.dark{left:auto;right:16px}
.svc .card{
  position:relative;z-index:1;
  margin:-160px 36px 0;
  background:var(--bg);border-radius:12px;padding:24px;
  box-shadow:0 10px 30px rgba(var(--black-rgb),.1)
}
.svc h3{font-size:32px;margin-bottom:10px;line-height:1.1}
.svc p{font-size:18px;color:var(--muted);margin-bottom:20px}
.svc .card .btn,.svc .card .btn.sm{font-size:18px;padding:16px 24px}

/* trip cards */
.grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:50px}
.trip{position:relative;height:410px}
.trip .photo{height:290px;border-radius:12px;overflow:hidden}
.trip .card{position:absolute;left:24px;right:24px;bottom:0;background:var(--white);border-radius:12px;padding:24px;box-shadow:0 8px 24px rgba(var(--black-rgb),.1)}
.trip h3{font-size:24px}
.trip p{font-size:18px;color:var(--muted);margin:12px 0 20px 0}

/* FAQ section */
.faq-grid{margin-top:40px;display:grid;grid-template-columns:1fr 1fr;gap:24px;text-align:left}
.faq-card{background:var(--white);padding:24px;border-radius:12px;border:1px solid var(--border-light);box-shadow:0 4px 16px rgba(var(--black-rgb),.04)}
.faq-card h3{font-size:20px;margin-bottom:10px;color:var(--navy);line-height:1.2}
.faq-card p{color:var(--muted);font-size:16px;line-height:1.5}
.faq-card a{color:var(--navy);font-weight:700}

/* contact */
.contact{padding:100px 0;text-align:center;background:var(--white)}
.contact h2{font-size:40px;margin:14px 0}
.contact .sub{font-size:18px;color:var(--muted)}
.cgrid{display:grid;grid-template-columns:1fr 1fr;gap:24px;margin-top:40px;text-align:left}
.info{background:var(--navy);color:var(--white);border-radius:16px;padding:24px}
.info .inner{background:rgba(var(--white-rgb),.06);border-radius:10px;padding:20px;margin-bottom:16px}
.info h3{color:var(--white);font-size:24px;margin-bottom:12px}
.info p,.info li{font-size:18px;color:var(--bg)}
.stats{display:flex;gap:10px;margin:16px 0}
.stats div{flex:1;background:rgba(var(--white-rgb),.08);padding:16px 24px;border-radius:16px;font-size:14px;color:var(--yellow);font-weight:700;text-transform:uppercase}
.stats b{display:block;color:var(--white);font-size:18px}
.info ul{list-style:none;display:grid;gap:12px;margin-top:18px}
.info li::before{content:"•";color:var(--yellow);margin-right:10px}
.faster{background:var(--white);color:var(--navy);border-radius:10px;padding:18px;margin-top:40px}
.faster h3{font-size:24px;color:var(--text)}
.faster p{color:var(--muted);margin:4px 0 8px}
.faster .ph-no{font-weight:700;font-size:20px;margin-top:20px;display:flex;align-items:center;gap:12px}
.faster .ph-no span{display:flex}
.faster .ph-no a:hover{text-decoration:underline}

/* whatsapp */
.btn.wa{background:var(--whatsapp);color:var(--white);margin-top:20px}
.btn.wa svg{fill:currentColor}
.btn.wa:hover{background:var(--whatsapp-hover);box-shadow:0 8px 18px rgba(var(--whatsapp-rgb),.4)}
.wa-float{position:fixed;right:20px;bottom:calc(20px + env(safe-area-inset-bottom,0px));z-index:60;width:58px;height:58px;border-radius:50%;background:var(--whatsapp);color:var(--white);display:flex;align-items:center;justify-content:center;box-shadow:0 8px 20px rgba(var(--black-rgb),.25);animation:waPulse 2.4s 2s infinite;transition:transform .25s,background .25s}
.wa-float svg{width:32px;height:32px;fill:currentColor}
.wa-float:hover{transform:scale(1.08);background:var(--whatsapp-hover)}
.form{background:var(--white);border:1px solid var(--border-light);border-radius:14px;padding:24px;box-shadow:0 8px 24px rgba(var(--black-rgb),.05)}
.form h3{font-size:24px}.form>p{font-size:18px;color:var(--muted);margin-bottom:12px}
label{display:block;font-size:16px;font-weight:600;color:var(--navy);margin:14px 0 6px}
label i{color:var(--error);font-style:normal}
input,textarea{width:100%;padding:14px;border:1px solid var(--border);border-radius:6px;background:var(--input-bg);font:16px 'Open Sans',sans-serif}
textarea{height:130px;resize:vertical}
.send{width:100%;margin-top:18px;border:0;cursor:pointer;background:var(--yellow);color:var(--navy);font:700 16px 'Open Sans',sans-serif;padding:16px;border-radius:6px}
footer{background:var(--navy);color:var(--white);text-align:center;font-size:12px;padding:22px}
footer .seo-areas{max-width:820px;margin:0 auto 10px;color:rgba(var(--white-rgb),.75);line-height:1.5}

/* responsive */
@media(max-width:1100px){
  .about .wrap{gap:60px}
  .about-card{right:-20px}
}

@media(max-width:900px){
  .hero .wrap,.about .wrap,.grid2,.cgrid,.faq-grid{grid-template-columns:1fr}
  .grid3{grid-template-columns:1fr 1fr}

  header{padding:10px 16px}
  html{--header-h:60px} /* fallback if JS is off */
  .logo img{height:40px;width:auto}
  .menu-toggle{display:flex}
  nav{display:none;position:absolute;top:100%;left:0;right:0;flex-direction:column;align-items:stretch;gap:4px;padding:8px 16px 16px;background:var(--bg);box-shadow:0 10px 20px rgba(var(--black-rgb),.1)}
  nav.open{display:flex}
  nav a{text-align:center;padding:12px 16px}

  .hero{padding:60px 0}
  .hero h1{font-size:42px}
  .hero p{max-width:none}
  .hero-card{margin:0;height:420px;max-width:none;justify-self:center}

  .about,.sec,.contact{padding:70px 0}
  .about .wrap{gap:50px}
  .about h2,.sec h2{font-size:40px}

  .about-img{height:460px}
  .about-card{right:10px}

  .trip{height:auto}
  .trip .photo{height:260px}
  .trip .card{position:relative;left:auto;right:auto;bottom:auto;margin:-70px 20px 0}
}

@media(max-width:600px){
  .grid3{grid-template-columns:1fr}

  .hero{padding:48px 0}
  .hero h1{font-size:34px}
  .hero p{font-size:16px;margin:16px 0 28px}
  .hero .btns{gap:12px}
  .hero .btns .btn{flex:1 1 100%;justify-content:center}
  .btn{font-size:16px;padding:14px 20px}
  .hero-card{height:380px;border-width:10px;border-radius:24px}
  .hero-note{width:calc(100% - 32px);font-size:14px}
  .hero-note b{font-size:16px}
  .hero-card .tag.dark{top:60px;right:auto!important;left:16px!important}

  .about,.sec,.contact{padding:56px 0}
  .about h2,.sec h2{font-size:32px}
  .contact h2{font-size:30px}
  .about p,.sec>.wrap>p,.contact .sub{font-size:16px}
  .pill{font-size:14px}

  .about-img{height:380px}
  .about-card{position:relative;right:auto;bottom:auto;width:auto;margin:-70px 12px 0}

  .svc-media{height:340px}
  .svc .card{margin:-90px 16px 0;padding:20px}
  .svc h3{font-size:26px}
  .svc p{font-size:16px}
  .svc .card .btn,.svc .card .btn.sm{font-size:16px;padding:12px 18px}

  .trip .photo{height:240px}
  .trip .card{margin:-60px 16px 0;padding:20px}
  .trip p{font-size:16px}

  .wa-float{right:14px;width:54px;height:54px}
  .btn.wa{width:100%;justify-content:center}

  .stats{flex-direction:column}
  .info,.form{padding:16px}
  .info .inner{padding:16px}
  .info h3,.faster h3,.form h3{font-size:20px}
  .info p,.info li,.form>p{font-size:16px}
  .faster .ph-no{font-size:18px}
}

/* animations */
@keyframes fadeUp{from{opacity:0;transform:translateY(30px)}to{opacity:1;transform:none}}
@keyframes fadeLeft{from{opacity:0;transform:translateX(50px) scale(.97)}to{opacity:1;transform:none}}
@keyframes float{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes pulse{0%{box-shadow:0 0 0 0 rgba(var(--yellow-rgb),.6)}70%{box-shadow:0 0 0 12px rgba(var(--yellow-rgb),0)}100%{box-shadow:0 0 0 0 rgba(var(--yellow-rgb),0)}}
@keyframes waPulse{0%{box-shadow:0 0 0 0 rgba(var(--whatsapp-rgb),.55)}70%{box-shadow:0 0 0 14px rgba(var(--whatsapp-rgb),0)}100%{box-shadow:0 0 0 0 rgba(var(--whatsapp-rgb),0)}}
@keyframes slideDown{from{opacity:0;transform:translateY(-100%)}to{opacity:1;transform:none}}
header{animation:slideDown .6s ease both;position:sticky;top:0;z-index:50;transition:box-shadow .3s}
header.scrolled{box-shadow:0 4px 20px rgba(var(--black-rgb),.12)}
.hero h1{animation:fadeUp .8s .2s ease both}
.hero p{animation:fadeUp .8s .4s ease both}
.hero .btns{animation:fadeUp .8s .6s ease both}
.hero-card{animation:fadeLeft 1s .3s ease both}
.hero-note{animation:float 4s ease-in-out infinite}
.hero-card img,.about-img img,.svc img,.trip .photo img{transition:transform .8s ease}
.hero-card:hover img,.about-img:hover img,.svc:hover img,.trip:hover .photo img{transform:scale(1.06)}
.btn{transition:transform .25s,box-shadow .25s,background .25s}
.btn:hover{transform:translateY(-3px);box-shadow:0 8px 18px rgba(var(--yellow-rgb),.45)}
.btn.outline:hover{background:var(--white);color:var(--navy);box-shadow:none}
.btn:active{transform:translateY(0)}
.hero .btn:first-child{animation:pulse 2.4s 1.5s infinite}
nav a{position:relative;transition:color .2s}
nav a:not(.active):not(.nav-cta)::after{content:"";position:absolute;left:16px;right:16px;bottom:4px;height:2px;background:var(--yellow);transform:scaleX(0);transform-origin:left;transition:transform .3s}
nav a:not(.active):not(.nav-cta):hover::after{transform:scaleX(1)}
.svc .card,.trip .card,.about-card{transition:transform .35s ease,box-shadow .35s ease}
.svc:hover .card,.trip:hover .card{transform:translateY(-8px);box-shadow:0 18px 40px rgba(var(--navy-rgb),.18)}
.about-card{animation:float 5s 1s ease-in-out infinite}
input,textarea{transition:border-color .2s,box-shadow .2s,background .2s}
input:focus,textarea:focus{outline:0;border-color:var(--yellow);background:var(--white);box-shadow:0 0 0 3px rgba(var(--yellow-rgb),.3)}
.send{transition:transform .25s,box-shadow .25s}
.send:hover{transform:translateY(-2px);box-shadow:0 8px 18px rgba(var(--yellow-rgb),.45)}
.stats div{transition:transform .25s}.stats div:hover{transform:translateY(-3px)}
.js .reveal{opacity:0;transform:translateY(40px);transition:opacity .8s ease,transform .8s ease;transition-delay:var(--d,0s)}
.js .reveal.left{transform:translateX(-50px)}
.js .reveal.right{transform:translateX(50px)}
.js .reveal.in{opacity:1;transform:none}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important}.js .reveal{opacity:1;transform:none}}

/* form validation & status */
.field-error{border-color:var(--error)!important;background:var(--error-bg)!important}
.err-text{display:block;color:var(--error);font-size:12px;margin-top:4px}
.form-status{margin-top:14px;font-size:13px;font-weight:600;border-radius:6px;padding:0;text-align:center}
.form-status.ok{background:var(--success-bg);color:var(--success);padding:12px}
.form-status.fail{background:var(--error-soft);color:var(--error-dark);padding:12px}
.send:disabled{opacity:.7;cursor:not-allowed;transform:none}