/* =============================================
   TRAVEL AND ADS — assets/css/style.css
   ============================================= */

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

:root{
  --bg:#060d1f;
  --bg2:#0a1628;
  --bg3:#0f1f3d;
  --cyan:#00d4ff;
  --blue:#3b82f6;
  --purple:#8b5cf6;
  --white:#f0f6ff;
  --muted:#6b7fa3;
  --muted2:#4a5a7a;
  --border:rgba(0,212,255,0.12);
  --font:'Inter',system-ui,sans-serif;
  --font2:'Plus Jakarta Sans',system-ui,sans-serif;
}

html{scroll-behavior:smooth;}
body{background:var(--bg);color:var(--white);font-family:var(--font);overflow-x:hidden;line-height:1.6;}

/* CANVAS */
#particles{position:fixed;inset:0;pointer-events:none;z-index:0;opacity:0.45;}

/* ---- NAV ---- */
nav{
  position:fixed;top:0;left:0;right:0;z-index:100;
  display:flex;align-items:center;justify-content:space-between;
  padding:1rem 2.5rem;
  background:rgba(6,13,31,0.9);
  backdrop-filter:blur(20px);
  border-bottom:1px solid var(--border);
}
.nav-logo{
  font-family:var(--font2);font-size:1.15rem;font-weight:700;
  background:linear-gradient(90deg,var(--cyan),var(--blue));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.nav-links{display:flex;gap:2rem;list-style:none;}
.nav-links a{color:var(--muted);text-decoration:none;font-size:0.83rem;transition:color .3s;}
.nav-links a:hover{color:var(--cyan);}
.nav-cta{
  background:linear-gradient(135deg,var(--cyan),var(--blue));
  color:#000;padding:.55rem 1.4rem;border-radius:6px;
  font-size:.82rem;font-weight:700;text-decoration:none;transition:all .3s;
}
.nav-cta:hover{opacity:.85;transform:translateY(-1px);}

/* ---- HERO ---- */
.hero{
  min-height:100vh;display:flex;flex-direction:column;
  align-items:center;justify-content:center;
  text-align:center;padding:8rem 2rem 4rem;
  position:relative;z-index:1;overflow:hidden;
}
.hero-glow{
  position:absolute;top:30%;left:50%;transform:translate(-50%,-50%);
  width:800px;height:800px;border-radius:50%;
  background:radial-gradient(circle,rgba(0,212,255,.06) 0%,rgba(59,130,246,.03) 40%,transparent 70%);
  pointer-events:none;
}
.hero-badge{
  display:inline-flex;align-items:center;gap:.5rem;
  border:1px solid rgba(0,212,255,.3);background:rgba(0,212,255,.05);
  padding:.35rem 1rem;border-radius:20px;
  font-size:.7rem;letter-spacing:.12em;text-transform:uppercase;color:var(--cyan);
  margin-bottom:1rem;animation:fadeUp .8s ease both;
}
.hero-badge-dot{width:6px;height:6px;background:var(--cyan);border-radius:50%;animation:blink 2s infinite;}
@keyframes blink{0%,100%{opacity:1}50%{opacity:.2}}

.hero-counter{
  font-size:.8rem;color:var(--muted);margin-bottom:1.25rem;
  animation:fadeUp .8s .05s ease both;
}
.hero-counter span{color:var(--cyan);font-weight:700;font-size:1.1rem;}

.hero-title{
  font-family:var(--font2);
  font-size:clamp(2rem,4.5vw,3.8rem);
  font-weight:700;line-height:1.1;margin-bottom:1.5rem;
  animation:fadeUp .8s .15s ease both;
}
.hero-title .accent{
  background:linear-gradient(90deg,var(--cyan),var(--blue),var(--purple));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  display:block;
}
.hero-sub{
  font-size:1.05rem;color:var(--muted);max-width:560px;
  margin:0 auto 2.5rem;line-height:1.75;font-weight:300;
  animation:fadeUp .8s .3s ease both;
}
.hero-actions{
  display:flex;gap:1rem;justify-content:center;flex-wrap:wrap;
  animation:fadeUp .8s .45s ease both;
}

/* ---- BUTTONS ---- */
.btn-primary{
  background:linear-gradient(135deg,var(--cyan),var(--blue));
  color:#000;padding:.85rem 2rem;border-radius:8px;
  font-weight:700;font-size:.9rem;text-decoration:none;
  transition:all .3s;display:inline-block;border:none;cursor:pointer;
}
.btn-primary:hover{transform:translateY(-3px);box-shadow:0 0 30px rgba(0,212,255,.35);}
.btn-ghost{
  border:1px solid rgba(0,212,255,.35);color:var(--cyan);
  padding:.85rem 2rem;border-radius:8px;
  font-size:.9rem;text-decoration:none;background:rgba(0,212,255,.05);
  transition:all .3s;display:inline-block;
}
.btn-ghost:hover{background:rgba(0,212,255,.12);transform:translateY(-2px);}

/* ---- LOGO STRIP ---- */
.logo-strip{
  position:relative;z-index:1;
  border-top:1px solid var(--border);border-bottom:1px solid var(--border);
  background:rgba(10,22,40,.5);padding:1.5rem 2rem;text-align:center;
}
.logo-strip-label{font-size:.68rem;letter-spacing:.15em;text-transform:uppercase;color:var(--muted2);margin-bottom:1rem;}
.logo-strip-inner{display:flex;justify-content:center;align-items:center;gap:1.5rem;flex-wrap:wrap;}
.logo-pill{
  border:1px solid var(--border);border-radius:6px;
  padding:.5rem 1.2rem;font-size:.78rem;color:var(--muted);font-weight:500;
}

/* ---- STATS STRIP ---- */
.stats-strip{
  position:relative;z-index:1;
  display:flex;justify-content:center;flex-wrap:wrap;
  background:rgba(10,22,40,.6);
}
.stat-block{
  flex:1;min-width:120px;max-width:200px;
  text-align:center;padding:1.75rem 1rem;
  border-right:1px solid var(--border);
}
.stat-block:last-child{border-right:none;}
.stat-n{
  font-family:var(--font2);font-size:1.8rem;font-weight:700;
  background:linear-gradient(135deg,var(--cyan),var(--blue));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.stat-l{font-size:.7rem;color:var(--muted);letter-spacing:.1em;text-transform:uppercase;margin-top:.25rem;}

/* ---- SHARED SECTION ---- */
section{padding:6rem 2.5rem;position:relative;z-index:1;}
.section-label{font-size:.68rem;letter-spacing:.18em;text-transform:uppercase;color:var(--cyan);margin-bottom:.75rem;}
.section-title{
  font-family:var(--font2);font-size:clamp(1.6rem,3vw,2.4rem);
  font-weight:600;line-height:1.15;margin-bottom:1rem;
}
.section-title span{
  background:linear-gradient(90deg,var(--cyan),var(--blue));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.section-sub{font-size:.95rem;color:var(--muted);max-width:520px;line-height:1.75;}
.centered{text-align:center;}
.centered .section-sub{margin:0 auto;}

/* ---- SERVICES ---- */
.services-bg{background:var(--bg2);}
.srv-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(270px,1fr));
  gap:1.25rem;margin-top:2.5rem;max-width:1100px;margin-left:auto;margin-right:auto;
}
.scard{
  background:rgba(15,31,61,.6);border:1px solid var(--border);
  border-radius:12px;padding:2rem;transition:all .4s;position:relative;overflow:hidden;
}
.scard:hover{border-color:rgba(0,212,255,.4);transform:translateY(-4px);box-shadow:0 0 40px rgba(0,212,255,.1);}
.scard-icon{
  width:44px;height:44px;border-radius:10px;
  background:linear-gradient(135deg,rgba(0,212,255,.15),rgba(59,130,246,.1));
  border:1px solid rgba(0,212,255,.2);
  display:flex;align-items:center;justify-content:center;
  font-size:1.2rem;margin-bottom:1.25rem;
}
.scard-title{font-size:1rem;font-weight:600;margin-bottom:.6rem;font-family:var(--font2);}
.scard-desc{font-size:.85rem;color:var(--muted);line-height:1.7;}
.scard-tag{
  display:inline-block;margin-top:1rem;
  font-size:.67rem;letter-spacing:.1em;text-transform:uppercase;
  color:var(--cyan);border:1px solid rgba(0,212,255,.25);
  padding:.2rem .6rem;border-radius:4px;
}

/* ---- WHY US ---- */
.why-section{background:var(--bg);}
.why-grid{
  display:grid;grid-template-columns:1fr 1fr;gap:4rem;
  align-items:start;max-width:1100px;margin:3rem auto 0;
}
.why-step{display:flex;gap:1.25rem;margin-bottom:2.5rem;align-items:flex-start;}
.why-num{
  width:3rem;height:3rem;border-radius:50%;
  background:rgba(0,212,255,.08);border:1px solid rgba(0,212,255,.3);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font2);font-size:.82rem;font-weight:700;color:var(--cyan);flex-shrink:0;
}
.why-step-title{font-size:1rem;font-weight:600;margin-bottom:.4rem;font-family:var(--font2);}
.why-step-desc{font-size:.85rem;color:var(--muted);line-height:1.7;}
.why-visual{
  background:rgba(10,22,40,.8);border:1px solid var(--border);
  border-radius:16px;padding:2rem;position:relative;overflow:hidden;
}
.why-visual::before{
  content:'';position:absolute;top:-1px;left:2rem;right:2rem;height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
}
.metrics-2{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin-bottom:1.5rem;}
.metric-box{
  background:rgba(0,212,255,.04);border:1px solid var(--border);
  border-radius:10px;padding:1.25rem;
}
.metric-val{
  font-family:var(--font2);font-size:1.6rem;font-weight:700;
  background:linear-gradient(90deg,var(--cyan),var(--blue));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.metric-lbl{font-size:.72rem;color:var(--muted);margin-top:.25rem;}
.metric-up{font-size:.68rem;color:#22d3a0;margin-top:.2rem;}
.bar-list{border-top:1px solid var(--border);padding-top:1.5rem;}
.bar-row{display:flex;align-items:center;gap:.75rem;margin-bottom:.9rem;}
.bar-lbl{font-size:.73rem;color:var(--muted);width:100px;flex-shrink:0;}
.bar-track{flex:1;height:3px;background:rgba(255,255,255,.06);border-radius:2px;overflow:hidden;}
.bar-fill{height:100%;background:linear-gradient(90deg,var(--cyan),var(--blue));border-radius:2px;animation:barGrow 1.5s ease both;}
@keyframes barGrow{from{transform:scaleX(0)}to{transform:scaleX(1)}}
.bar-pct{font-size:.72rem;color:var(--cyan);width:36px;text-align:right;}

/* ---- PORTFOLIO ---- */
.portfolio-bg{background:var(--bg2);}
.port-grid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));
  gap:1.25rem;margin-top:2.5rem;max-width:1100px;margin-left:auto;margin-right:auto;
}
.port-card{
  background:rgba(15,31,61,.7);border:1px solid var(--border);
  border-radius:12px;overflow:hidden;transition:all .4s;
}
.port-card:hover{border-color:rgba(0,212,255,.35);transform:translateY(-3px);}
.port-img{
  height:140px;display:flex;align-items:center;
  justify-content:center;font-size:2.5rem;
}
.port-img-hotel{background:linear-gradient(135deg,#0a1628,#0f2a4a);}
.port-img-agency{background:linear-gradient(135deg,#0d1a0d,#0a281a);}
.port-img-resort{background:linear-gradient(135deg,#1a0a28,#0a0f28);}
.port-body{padding:1.25rem;}
.port-tag{font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;color:var(--cyan);margin-bottom:.4rem;}
.port-name{font-size:.95rem;font-weight:600;margin-bottom:.4rem;font-family:var(--font2);}
.port-result{font-size:.8rem;color:#22d3a0;}

/* ---- TESTIMONIALS ---- */
.testi-bg{background:var(--bg);}
.tgrid{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));
  gap:1.25rem;margin-top:2.5rem;max-width:1100px;margin-left:auto;margin-right:auto;
}
.tcard{
  background:rgba(10,22,40,.7);border:1px solid var(--border);
  border-radius:12px;padding:1.75rem;transition:border-color .3s;position:relative;
}
.tcard::before{
  content:'\201C';font-family:var(--font2);font-size:3.5rem;
  color:var(--cyan);opacity:.2;position:absolute;top:.5rem;left:1.25rem;line-height:1;
}
.tcard:hover{border-color:rgba(0,212,255,.3);}
.tcard-stars{color:var(--cyan);font-size:.72rem;letter-spacing:3px;margin-bottom:1rem;}
.tcard-text{font-size:.875rem;color:#a0b0cc;line-height:1.75;margin-bottom:1.25rem;margin-top:.5rem;}
.tcard-author{display:flex;align-items:center;gap:.75rem;}
.tcard-av{
  width:38px;height:38px;border-radius:50%;flex-shrink:0;
  background:linear-gradient(135deg,var(--cyan),var(--blue));
  display:flex;align-items:center;justify-content:center;
  font-size:.7rem;font-weight:700;color:#000;
}
.tcard-name{font-size:.82rem;font-weight:600;}
.tcard-role{font-size:.72rem;color:var(--muted);}

/* ---- METHODOLOGY ---- */
.method-bg{background:var(--bg2);}
.method-steps{
  display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));
  gap:0;margin-top:4rem;max-width:1000px;
  margin-left:auto;margin-right:auto;position:relative;
}
.method-steps::after{
  content:'';position:absolute;top:1.75rem;left:5%;right:5%;height:1px;
  background:linear-gradient(90deg,transparent,rgba(0,212,255,.2),var(--cyan),rgba(0,212,255,.2),transparent);
  z-index:0;
}
.mstep{padding:0 1.25rem;text-align:center;position:relative;z-index:1;}
.mstep-circle{
  width:3.5rem;height:3.5rem;border-radius:50%;
  background:var(--bg2);border:1px solid rgba(0,212,255,.35);
  display:flex;align-items:center;justify-content:center;
  font-family:var(--font2);font-size:.82rem;font-weight:700;color:var(--cyan);
  margin:0 auto 1.25rem;box-shadow:0 0 20px rgba(0,212,255,.1);
}
.mstep-name{font-size:.9rem;font-weight:600;margin-bottom:.5rem;font-family:var(--font2);}
.mstep-desc{font-size:.78rem;color:var(--muted);line-height:1.65;}

/* ---- CTA + FORM ---- */
.cta-section{
  text-align:center;padding:7rem 2rem;
  background:radial-gradient(ellipse 80% 60% at 50% 100%,rgba(0,212,255,.07),transparent);
  border-top:1px solid var(--border);position:relative;z-index:1;
}
.cta-title{
  font-family:var(--font2);font-size:clamp(1.8rem,3.5vw,3rem);
  font-weight:700;line-height:1.1;margin-bottom:1rem;
}
.cta-title span{
  background:linear-gradient(90deg,var(--cyan),var(--blue),var(--purple));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.cta-sub{font-size:1rem;color:var(--muted);max-width:480px;margin:0 auto 2.5rem;line-height:1.7;}
.contact-form{
  background:rgba(10,22,40,.8);border:1px solid var(--border);
  border-radius:16px;padding:2.5rem;max-width:540px;
  margin:0 auto;text-align:left;position:relative;
}
.contact-form::before{
  content:'';position:absolute;top:-1px;left:3rem;right:3rem;height:1px;
  background:linear-gradient(90deg,transparent,var(--cyan),transparent);
}
.form-row{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin-bottom:1rem;}
.form-group{margin-bottom:1rem;}
.form-group label{display:block;font-size:.75rem;color:var(--muted);margin-bottom:.35rem;letter-spacing:.06em;}
.form-group input,
.form-group select,
.form-group textarea{
  width:100%;background:rgba(0,212,255,.04);border:1px solid var(--border);
  border-radius:6px;padding:.7rem 1rem;color:var(--white);
  font-size:.85rem;font-family:var(--font);transition:border-color .3s;outline:none;
}
.form-group input:focus,
.form-group select:focus,
.form-group textarea:focus{border-color:rgba(0,212,255,.5);}
.form-group select option{background:var(--bg2);color:var(--white);}
.form-submit{
  width:100%;background:linear-gradient(135deg,var(--cyan),var(--blue));
  color:#000;padding:.9rem;border-radius:8px;
  font-weight:700;font-size:.9rem;border:none;cursor:pointer;
  transition:all .3s;margin-top:.5rem;font-family:var(--font);
}
.form-submit:hover{transform:translateY(-2px);box-shadow:0 0 25px rgba(0,212,255,.3);}
.form-note{font-size:.72rem;color:var(--muted2);text-align:center;margin-top:.75rem;line-height:1.6;}
.cta-trust{
  margin-top:2rem;font-size:.75rem;color:var(--muted2);
  display:flex;align-items:center;justify-content:center;gap:1.5rem;flex-wrap:wrap;
}
.trust-item{display:flex;align-items:center;gap:.4rem;}
.trust-dot{width:5px;height:5px;background:var(--cyan);border-radius:50%;opacity:.6;}

/* ---- FOOTER ---- */
footer{
  background:var(--bg2);border-top:1px solid var(--border);
  padding:3rem 2.5rem 1.5rem;position:relative;z-index:1;
}
.footer-top{
  display:grid;grid-template-columns:2fr 1fr 1fr 1fr;
  gap:3rem;margin-bottom:2.5rem;
}
.footer-logo{
  font-family:var(--font2);font-size:1.1rem;font-weight:800;
  background:linear-gradient(90deg,var(--cyan),var(--blue));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
  margin-bottom:.75rem;
}
.footer-tagline{font-size:.82rem;color:var(--muted);line-height:1.65;margin-bottom:1rem;}
.footer-social{display:flex;gap:.75rem;}
.footer-social a{
  width:32px;height:32px;border-radius:6px;border:1px solid var(--border);
  display:flex;align-items:center;justify-content:center;
  font-size:.8rem;color:var(--muted);text-decoration:none;transition:all .3s;
}
.footer-social a:hover{border-color:var(--cyan);color:var(--cyan);}
.footer-col-title{font-size:.8rem;font-weight:600;color:var(--white);margin-bottom:1rem;letter-spacing:.06em;text-transform:uppercase;}
.footer-col a{display:block;font-size:.78rem;color:var(--muted);text-decoration:none;margin-bottom:.5rem;transition:color .3s;}
.footer-col a:hover{color:var(--cyan);}
.footer-bottom{
  border-top:1px solid var(--border);padding-top:1.25rem;
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:.5rem;
}
.footer-copy{font-size:.73rem;color:var(--muted2);}
.footer-legal{display:flex;gap:1.5rem;}
.footer-legal a{font-size:.73rem;color:var(--muted2);text-decoration:none;transition:color .3s;}
.footer-legal a:hover{color:var(--cyan);}

/* ---- ANIMATIONS ---- */
@keyframes fadeUp{from{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}

/* ---- RESPONSIVE ---- */
@media(max-width:900px){
  .why-grid{grid-template-columns:1fr;gap:2rem;}
  .footer-top{grid-template-columns:1fr 1fr;}
}
@media(max-width:700px){
  nav{padding:1rem 1.25rem;}
  .nav-links{display:none;}
  section{padding:4rem 1.25rem;}
  .method-steps::after{display:none;}
  .form-row{grid-template-columns:1fr;}
  .footer-top{grid-template-columns:1fr;}
  .footer-bottom{flex-direction:column;text-align:center;}
  .footer-legal{justify-content:center;}
  .stat-block{border-right:none;border-bottom:1px solid var(--border);}
}