:root{
  --primary:#d4a64a;
  --primary-dark:#b78628;
  --accent:#1f3558;
  --light:#fffaf0;
  --white:#ffffff;
  --text:#2b2b2b;
  --muted:#666666;
  --border:#f0e4c6;
  --shadow:0 12px 30px rgba(31, 53, 88, 0.08);
  --radius:18px;
  --container:1200px;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth}
body{font-family:Arial,Helvetica,sans-serif;color:var(--text);background:var(--white);line-height:1.6}
a{text-decoration:none;color:inherit}
img{max-width:100%;display:block}
.container{width:min(92%,var(--container));margin:0 auto}

.topbar{background:#1f3558;color:#fff;font-size:14px;padding:10px 0}
.topbar .container{display:flex;justify-content:space-between;align-items:center;gap:15px;flex-wrap:wrap;padding:0 24px}
.topbar strong{color:#ffd36b}

header{position:sticky;top:0;z-index:1000;background:#fffaf0;backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}
.navbar{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:18px 0}
.logo{font-size:28px;font-weight:700;color:var(--primary-dark);letter-spacing:.3px}
.logo span{color:var(--accent)}

/* for image logo */
.logo-image{
  display:flex;
  align-items:center;
  text-decoration:none;
}
.logo-image img{
  height:64px;
  width:auto;
  display:block;
}

nav ul{list-style:none;display:flex;gap:24px;align-items:center;flex-wrap:wrap}
nav a{color:var(--text);font-weight:600;font-size:15px;transition:.2s ease}
nav a:hover, nav a.active{color:var(--primary)}
.btn{display:inline-flex;align-items:center;justify-content:center;border:none;cursor:pointer;padding:14px 22px;border-radius:999px;font-weight:700;transition:.25s ease}
.btn-primary{background:var(--primary);color:#fff;box-shadow:var(--shadow)}
.btn-primary:hover{background:var(--primary-dark);transform:translateY(-2px)}
.btn-outline{border:2px solid #fff;color:#fff;background:transparent}
.btn-outline:hover{background:#fff;color:var(--primary-dark)}

.hero{position:relative;min-height:88vh;display:flex;align-items:center;overflow:hidden;color:#fff}
.hero::before{content:"";position:absolute;inset:0;background:url('https://images.unsplash.com/photo-1474487548417-781cb71495f3?auto=format&fit=crop&w=1600&q=80') center/cover no-repeat;filter:blur(6px);transform:scale(1.08);z-index:1}
.hero::after{content:"";position:absolute;inset:0;background:rgba(18,39,57,.55);z-index:2}
.hero .container{position:relative;z-index:3}
.hero-content{max-width:720px;padding:90px 0}
.eyebrow{display:inline-block;background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.2);padding:10px 16px;border-radius:999px;font-size:13px;letter-spacing:.5px;text-transform:uppercase;margin-bottom:20px}
.hero h1{font-size:58px;line-height:1.08;margin-bottom:18px;font-weight:800}
.hero p{font-size:18px;max-width:640px;color:rgba(255,255,255,.92);margin-bottom:30px}
.hero-actions{display:flex;flex-wrap:wrap;gap:14px;margin-bottom:28px}
.hero-highlights{display:flex;gap:26px;flex-wrap:wrap;font-size:15px;color:rgba(255,255,255,.92)}

.page-hero{
    position: relative;
    padding: 90px 0 70px;
    color: #ffffff;
    overflow: hidden;
}

.page-hero::before{
    content: "";
    position: absolute;
    inset: 0;
    background: url('https://images.unsplash.com/photo-1474487548417-781cb71495f3?auto=format&fit=crop&w=1600&q=80') center/cover no-repeat;
    filter: blur(4px);
    transform: scale(1.05);
    z-index: 1;
}

.page-hero::after{
    content: "";
    position: absolute;
    inset: 0;
    background: rgba(31,53,88,.65);
    z-index: 2;
}

.page-hero .container{
    position: relative;
    z-index: 3;
}

.page-hero h1{
    font-size: 46px;
    color: #ffffff;
    margin-bottom: 12px;
}

.page-hero p{
    max-width: 760px;
    color: rgba(255,255,255,.92);
    font-size: 18px;
}

section{padding:80px 0}
.section-title{text-align:center;max-width:760px;margin:0 auto 46px}
.section-title h2{font-size:40px;margin-bottom:12px;color:var(--primary-dark)}
.section-title p{color:var(--muted);font-size:17px}

.packages-grid,.features-grid,.destinations-grid,.steps-grid,.testimonials-grid,.policy-grid{display:grid;gap:24px}
.packages-grid{grid-template-columns:repeat(3,1fr);gap:28px}
.features-grid{grid-template-columns:repeat(4,1fr)}
.destinations-grid{grid-template-columns:repeat(4,1fr)}
.steps-grid{grid-template-columns:repeat(4,1fr)}
.testimonials-grid{grid-template-columns:repeat(3,1fr)}
.policy-grid{grid-template-columns:1fr 1fr}

.card,.feature-box,.step,.testimonial,.info-card,.form-card,.policy-card{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}
.card{overflow:hidden;transition:.25s ease}
.card:hover{transform:translateY(-6px)}
.card img{width:100%;height:230px;object-fit:cover}
.card-body{padding:24px}
.badge{display:inline-block;background:#eef6fb;color:var(--primary-dark);font-size:12px;font-weight:700;padding:8px 12px;border-radius:999px;margin-bottom:14px;text-transform:uppercase;letter-spacing:.4px}
.card h3,.feature-box h3,.step h3,.info-card h3,.policy-card h3{font-size:23px;margin-bottom:10px;color:var(--primary-dark)}
.card p,.feature-box p,.step p,.testimonial p,.info-card p,.policy-card p{color:var(--muted);font-size:15px}
.meta{display:flex;flex-wrap:wrap;gap:14px;font-size:14px;color:#4d5c67;margin-bottom:18px}
.price{font-size:22px;font-weight:800;color:var(--accent);margin-bottom:18px}
.features{background:var(--light)}
.feature-box,.step,.testimonial,.info-card,.policy-card{padding:28px 24px}
.destination{position:relative;border-radius:var(--radius);overflow:hidden;min-height:280px;box-shadow:var(--shadow)}
.destination img{width:100%;height:100%;object-fit:cover}
.destination-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(13,28,42,.82),rgba(13,28,42,.18));display:flex;align-items:flex-end;padding:24px}
.destination h3{color:#fff;font-size:24px;margin-bottom:6px}
.destination p{color:rgba(255,255,255,.9);font-size:14px}
.split{display:grid;grid-template-columns:1.05fr .95fr;gap:42px;align-items:center}
.split img{border-radius:var(--radius);box-shadow:var(--shadow);height:100%;object-fit:cover}
.list{list-style:none;margin-top:22px}
.list li{padding:10px 0;color:var(--text);border-bottom:1px solid var(--border)}
.list li:last-child{border-bottom:none}
.steps{background:linear-gradient(180deg,#f9fbfd 0%,#eef5fa 100%)}
.step-number{width:46px;height:46px;border-radius:50%;background:var(--primary);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:800;margin-bottom:18px}
.testimonial p{font-style:italic;margin-bottom:18px}
.testimonial h4{color:var(--primary-dark);font-size:18px;margin-bottom:4px}
.testimonial span{color:#70808e;font-size:14px}
.cta{background:linear-gradient(135deg,#1f3558,#2a4a78);color:#fff}
.cta-box{text-align:center;max-width:860px;margin:0 auto}
.cta h2{font-size:42px;margin-bottom:14px}
.cta p{font-size:17px;color:rgba(255,255,255,.92);margin-bottom:28px}

.content-section{padding:60px 0}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:28px}
.form-card form{display:grid;gap:16px}
label{font-weight:700;color:var(--primary-dark);font-size:14px}
input,textarea,select{width:100%;padding:14px 15px;border:1px solid var(--border);border-radius:12px;font:inherit}
textarea{min-height:140px;resize:vertical}
.small-note{font-size:13px;color:var(--muted);margin-top:12px}
.inline-list{padding-left:18px;color:var(--muted)}
.inline-list li{margin-bottom:10px}

footer{background:#1a2b47;color:#f8f3e7;padding-top:70px}
.footer-grid{width:min(92%,1200px);margin:0 auto;display:grid;grid-template-columns:1.4fr 1fr 1fr 1.1fr;gap:30px;padding:0 24px 40px}
footer h3,footer h4{color:#ffd36b;margin-bottom:16px}
footer p,footer li,footer a{color:#f8f3e7;font-size:15px}
footer ul{list-style:none}
footer li{margin-bottom:10px}
.footer-bottom{width:min(92%,1200px);margin:0 auto;border-top:1px solid rgba(255,255,255,.08);padding:20px 24px 28px;font-size:14px;color:#e6dcc4}
.note{margin-top:14px;font-size:13px;color:#e6dcc4;line-height:1.7}

@media (max-width:1100px){
  .packages-grid,.features-grid,.destinations-grid,.steps-grid,.testimonials-grid,.policy-grid{grid-template-columns:repeat(2,1fr)}
  .split,.footer-grid,.info-grid{grid-template-columns:1fr}
  .hero h1{font-size:48px}
}

/* =========================
   Better tablet layout
========================= */
@media (max-width: 992px){
  .navbar{
    flex-direction: column;
    align-items: flex-start;
    gap: 14px;
  }

  nav ul{
    gap: 12px 16px;
  }

  .packages-grid,
  .features-grid,
  .destinations-grid,
  .steps-grid,
  .testimonials-grid,
  .policy-grid,
  .info-grid{
    grid-template-columns: 1fr 1fr;
  }

  .split,
  .footer-grid{
    grid-template-columns: 1fr;
  }

  .hero h1{
    font-size: 44px;
  }

  .section-title h2,
  .cta h2,
  .page-hero h1{
    font-size: 34px;
  }
}

/* =========================
   Mobile friendly layout
========================= */
@media (max-width: 768px){

  .container{
    width: min(94%, var(--container));
  }

  .topbar{
    font-size: 13px;
    padding: 10px 0;
  }

  .topbar .container{
    padding: 0 14px;
    gap: 8px;
  }

  header{
    position: static;
  }

  .navbar{
    display: flex;
    flex-direction: column;
    align-items: stretch;
    gap: 16px;
    padding: 14px 0 18px;
  }

  .logo{
    font-size: 24px;
  }

  .logo-image{
    justify-content: center;
    width: 100%;
  }

  .logo-image img{
    height: 58px;
    width: auto;
    margin: 0 auto;
  }

  nav{
    width: 100%;
  }

  nav ul{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 12px 16px;
    width: 100%;
    list-style: none;
    padding: 0;
    margin: 0;
  }

  nav ul li{
    width: 100%;
  }

  nav a{
    display: block;
    width: 100%;
    text-align: center;
    font-size: 15px;
    font-weight: 700;
    padding: 10px 8px;
    border-radius: 10px;
    background: rgba(212,166,74,0.08);
  }

  .navbar .btn-primary{
    width: 100%;
    justify-content: center;
    padding: 14px 18px;
    margin-top: 4px;
  }

  .hero{
    min-height: auto;
  }

  .hero-content{
    padding: 60px 0 50px;
  }

  .hero h1{
    font-size: 34px;
    line-height: 1.15;
  }

  .hero p{
    font-size: 16px;
  }

  .hero-actions{
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .hero-actions .btn{
    width: 100%;
  }

  .hero-highlights{
    flex-direction: column;
    gap: 10px;
  }

  .page-hero{
    padding: 60px 0 50px;
  }

  .page-hero h1{
    font-size: 32px;
    line-height: 1.15;
  }

  .page-hero p{
    font-size: 16px;
  }

  section{
    padding: 55px 0;
  }

  .section-title{
    margin: 0 auto 30px;
  }

  .section-title h2,
  .cta h2{
    font-size: 28px;
    line-height: 1.2;
  }

  .section-title p,
  .cta p{
    font-size: 16px;
  }

  .packages-grid,
  .features-grid,
  .destinations-grid,
  .steps-grid,
  .testimonials-grid,
  .policy-grid,
  .info-grid{
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .card img{
    height: 210px;
  }

  .destination{
    min-height: 220px;
  }

  .card-body,
  .feature-box,
  .step,
  .testimonial,
  .info-card,
  .form-card,
  .policy-card{
    padding: 20px;
  }

  .card h3,
  .feature-box h3,
  .step h3,
  .info-card h3,
  .policy-card h3{
    font-size: 20px;
  }

  .price{
    font-size: 20px;
  }

  .split{
    grid-template-columns: 1fr;
    gap: 24px;
  }

  .split img{
    max-height: 320px;
    width: 100%;
    object-fit: cover;
  }

  .btn{
    width: 100%;
    justify-content: center;
  }

  input,
  textarea,
  select{
    font-size: 16px;
  }

  .footer-grid{
    grid-template-columns: 1fr;
    gap: 22px;
    padding: 0 14px 28px;
  }

  .footer-bottom{
    padding: 16px 14px 24px;
  }
}

/* =========================
   Small phones
========================= */
@media (max-width: 480px){

  .hero-content{
    padding: 48px 0 42px;
  }

  .hero h1{
    font-size: 28px;
  }

  .page-hero h1{
    font-size: 27px;
  }

  .section-title h2,
  .cta h2{
    font-size: 24px;
  }

  .hero p,
  .page-hero p,
  .section-title p,
  .cta p{
    font-size: 15px;
  }

  .card img{
    height: 190px;
  }

  .destination{
    min-height: 200px;
  }

  .topbar{
    font-size: 12px;
  }

  .logo{
    font-size: 22px;
  }

  .logo-image img{
    height: 52px;
  }

  nav ul{
    grid-template-columns: 1fr;
  }
}
/* CONTACT PAGE SPACING FIX */
.contact-main-section{
    background: linear-gradient(180deg,#fffdf8 0%, #f8f3e8 100%);
    padding: 70px 0 !important;
}

.contact-layout{
    display: grid;
    grid-template-columns: 1.2fr 0.8fr;
    gap: 35px;
    align-items: start;
    margin-top: 20px;
}

.contact-form-box{
    padding: 35px !important;
    margin-top: 0 !important;
}

.contact-side{
    display: grid;
    gap: 22px;
}

.contact-side-card{
    padding: 28px !important;
}

.form-row{
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 20px;
    margin-bottom: 18px;
}

.form-row.single{
    grid-template-columns: 1fr;
}

.contact-cards{
    display: grid;
    grid-template-columns: repeat(3,1fr);
    gap: 22px;
    margin-top: 25px;
    margin-bottom: 20px;
}

.contact-mini-card{
    padding: 24px;
}

/* MOBILE FIX */
@media (max-width: 992px){
    .contact-layout{
        grid-template-columns: 1fr;
        gap: 25px;
    }

    .contact-cards{
        grid-template-columns: 1fr;
    }
}

@media (max-width: 768px){
    .contact-main-section{
        padding: 50px 0 !important;
    }

    .contact-form-box{
        padding: 22px !important;
    }

    .contact-side-card{
        padding: 22px !important;
    }

    .form-row{
        grid-template-columns: 1fr;
        gap: 14px;
    }
}