:root{
    --gold:#F2A900;
    --gold-deep:#C98600;
    --gold-pale:#FFF4DC;
    --ink:#15130C;
    --ink-soft:#4A4638;
    --paper:#FFFFFF;
    --cream:#FFFBF2;
    --line:#EDE3CC;
    --radius:18px;
  }
  *{box-sizing:border-box;}
  html{scroll-behavior:smooth;}
  body{
    font-family:'Inter', sans-serif;
    color:var(--ink);
    background:var(--paper);
    -webkit-font-smoothing:antialiased;
  }
  h1,h2,h3,h4, .display-font{
    font-family:'Fraunces', serif;
    letter-spacing:-0.01em;
  }
  .mono{
    font-family:'Space Mono', monospace;
    letter-spacing:0.04em;
  }
  .eyebrow{
    font-family:'Space Mono', monospace;
    font-size:0.72rem;
    letter-spacing:0.18em;
    text-transform:uppercase;
    color:var(--gold-deep);
    display:inline-flex;
    align-items:center;
    gap:10px;
  }
  .eyebrow::before{
    content:"";
    width:22px;height:2px;
    background:var(--gold-deep);
    display:inline-block;
  }
  .btn-gold{
    background:var(--gold);
    border:1px solid var(--gold);
    color:var(--ink);
    font-weight:700;
    border-radius:100px;
    padding:0.85rem 1.9rem;
    transition:all .25s ease;
  }
  .btn-gold:hover{
    background:var(--ink);
    border-color:var(--ink);
    color:var(--gold);
  }
  .btn-outline-ink{
    border:1.5px solid var(--ink);
    color:var(--ink);
    border-radius:100px;
    font-weight:600;
    padding:0.8rem 1.8rem;
    transition:all .25s ease;
  }
  .btn-outline-ink:hover{
    background:var(--ink);
    color:var(--gold);
  }

  /* ===== Nav ===== */
  .topbar{
    background:var(--ink);
    color:#DCD5C2;
    font-size:0.82rem;
  }
  .topbar a{color:#DCD5C2; text-decoration:none;}
  .topbar a:hover{color:var(--gold);}
  .navbar{
    background:var(--paper);
    border-bottom:1px solid var(--line);
  }
  .navbar-brand{
    font-family:'Fraunces', serif;
    font-weight:800;
    font-size:1.55rem;
    color:var(--ink) !important;
  }
  .navbar-brand span{color:var(--gold-deep);}
  .nav-link{
    font-weight:600;
    color:var(--ink) !important;
    margin:0 0.6rem;
    position:relative;
  }
  .nav-link::after{
    content:"";
    position:absolute; left:0; bottom:-2px;
    width:0; height:2px; background:var(--gold);
    transition:width .2s ease;
  }
  .nav-link:hover::after{width:100%;}

  /* ===== Hero ===== */
  .hero{
    position:relative;
    background:
      radial-gradient(1100px 500px at 85% -10%, rgba(242,169,0,0.16), transparent),
      var(--cream);
    overflow:hidden;
    padding-top:5.5rem;
    padding-bottom:3rem;
  }
  .hero-headline{
    font-size:clamp(2.5rem, 5vw, 4.2rem);
    font-weight:700;
    line-height:1.04;
  }
  .hero-headline em{
    font-style:normal;
    color:var(--gold-deep);
    position:relative;
  }
  .hero-stat{
    border-left:2px solid var(--gold);
    padding-left:0.9rem;
  }
  .hero-stat .num{
    font-family:'Fraunces', serif;
    font-size:2rem;
    font-weight:700;
    line-height:1;
  }
  .hero-stat .lbl{
    font-size:0.78rem;
    color:var(--ink-soft);
    text-transform:uppercase;
    letter-spacing:0.06em;
  }

  /* Route line signature */
  .route-line{
    position:relative;
    height:2px;
    background-image:repeating-linear-gradient(90deg, var(--gold) 0 14px, transparent 14px 26px);
    margin:2.5rem 0;
  }
  .route-line .pin{
    position:absolute; top:50%; transform:translate(-50%,-50%);
    width:34px;height:34px;border-radius:50%;
    background:var(--ink); color:var(--gold);
    display:flex; align-items:center; justify-content:center;
    font-size:0.85rem; box-shadow:0 6px 18px rgba(0,0,0,0.18);
  }

  /* ===== Booking card ===== */
  .booking-card{
    background:var(--ink);
    border-radius:var(--radius);
    padding:2rem;
    box-shadow:0 30px 60px -20px rgba(21,19,12,0.45);
  }
  .booking-card .form-label{
    color:#CFC7AE; font-size:0.78rem; text-transform:uppercase; letter-spacing:0.06em; font-weight:700;
  }
  .booking-card .form-control{
    background:#221F14; border:1px solid #38331F; color:#fff; border-radius:12px; padding:0.7rem 1rem;
  }
  .booking-card .form-control::placeholder{color:#8A8266;}
  .booking-card .form-control:focus{
    background:#221F14; border-color:var(--gold); color:#fff; box-shadow:0 0 0 3px rgba(242,169,0,0.2);
  }
  .trip-toggle .btn{
    border-radius:100px; font-weight:600; font-size:0.85rem; padding:0.55rem 0;
  }

  /* ===== Section basics ===== */
  section{padding:5.5rem 0;}
  .section-cream{background:var(--cream);}
  .section-ink{background:var(--ink); color:#EDE7D6;}
  .section-ink .eyebrow{color:var(--gold);}
  .section-ink .eyebrow::before{background:var(--gold);}

  /* ===== Fleet cards ===== */
  .fleet-card{
    border-radius:var(--radius);
    background:var(--paper);
    border:1px solid var(--line);
    overflow:hidden;
    transition:transform .3s ease, box-shadow .3s ease;
    height:100%;
  }
  .fleet-card:hover{
    transform:translateY(-6px);
    box-shadow:0 24px 44px -18px rgba(21,19,12,0.25);
  }
  .fleet-card .fleet-img{
    height:210px;
    background:linear-gradient(135deg, var(--gold-pale), #FFE9B8);
    display:flex; align-items:center; justify-content:center;
    font-size:3rem; color:var(--gold-deep);
  }
  .fleet-card .body{padding:1.4rem 1.4rem 1.6rem;}
  .fleet-tag{
    font-family:'Space Mono', monospace;
    font-size:0.7rem;
    letter-spacing:0.08em;
    text-transform:uppercase;
    color:var(--gold-deep);
    background:var(--gold-pale);
    border-radius:100px;
    padding:0.25rem 0.7rem;
    display:inline-block;
  }

  /* ===== Why us ===== */
  .adv-item{
    display:flex; gap:1rem; align-items:flex-start;
    padding:1.1rem 0;
    border-bottom:1px solid #2A2717;
  }
  .adv-item:last-child{border-bottom:none;}
  .adv-item i{color:var(--gold); font-size:1.1rem; margin-top:0.2rem;}

  .stat-block{
    text-align:center;
    padding:1.8rem 1rem;
    border-radius:var(--radius);
    background:#1B1810;
    border:1px solid #2A2717;
  }
  .stat-block .num{
    font-family:'Fraunces', serif; font-weight:700;
    font-size:2.6rem; color:var(--gold);
  }

  /* ===== Steps ===== */
  .step-card{
    background:var(--paper);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:2.2rem 1.8rem;
    height:100%;
    position:relative;
  }
  .step-card .step-mark{
    font-family:'Space Mono', monospace;
    font-size:0.78rem;
    color:var(--gold-deep);
    background:var(--gold-pale);
    border-radius:100px;
    width:38px;height:38px;
    display:flex; align-items:center; justify-content:center;
    margin-bottom:1.2rem;
  }

  /* ===== Testimonials ===== */
  .testi-card{
    background:var(--cream);
    border:1px solid var(--line);
    border-radius:var(--radius);
    padding:1.8rem;
    height:100%;
  }
  .testi-card .stars{color:var(--gold-deep); font-size:0.85rem;}
  .testi-card .name{font-weight:700; font-family:'Fraunces', serif;}

  /* ===== Footer ===== */
  footer{
    background:var(--ink);
    color:#B9B29A;
    padding-top:4rem;
  }
  footer h6{
    color:#fff; font-weight:700; margin-bottom:1rem;
    font-family:'Fraunces', serif;
  }
  footer a{color:#B9B29A; text-decoration:none;}
  footer a:hover{color:var(--gold);}
  .footer-bottom{
    border-top:1px solid #2A2717;
    margin-top:2.5rem;
    padding:1.2rem 0;
    font-size:0.85rem;
  }

  /* Floating actions */
  .float-actions{position:fixed; left:18px; bottom:24px; z-index:1030; display:flex; flex-direction:column; gap:10px;}
  .float-actions a{
    width:52px;height:52px;border-radius:50%;
    display:flex; align-items:center; justify-content:center;
    color:#fff; font-size:1.25rem; box-shadow:0 10px 22px rgba(0,0,0,0.25);
  }
  .float-actions .wa{background:#25D366;}
  .float-actions .ph{background:var(--ink); }

  @media (max-width:767px){
    section{padding:3.5rem 0;}
    .hero{padding-top:4.5rem;}
  }

  .services-section{
    background:#fff;
}

.service-card{
    position:relative;
    background:#fff;
    border-radius:20px;
    padding:35px 25px;
    overflow:hidden;
    transition:.4s;
    border:1px solid #e9ecef;
    box-shadow:0 15px 40px rgba(0,0,0,.08);
    height:100%;
}

.service-card:hover{
    transform:translateY(-10px);
    box-shadow:0 20px 50px rgba(13,110,253,.18);
}

.service-card::before{
    content:"";
    position:absolute;
    left:0;
    top:0;
    width:6px;
    height:100%;
    background:linear-gradient(180deg,#936627,#020a13);
}

.service-icon{
    width:80px;
    height:80px;
    border-radius:18px;
    background:linear-gradient(135deg,#936627,#020a13);
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:34px;
    margin-bottom:25px;
    transition:.4s;
}

.service-card:hover .service-icon{
    transform:rotate(-10deg) scale(1.1);
}

.service-card h4{
    font-weight:700;
    margin-bottom:15px;
}

.service-card p{
    color:#6c757d;
    line-height:28px;
    margin-bottom:20px;
}

.service-btn{
    text-decoration:none;
    color:#936627;
    font-weight:600;
}

.service-btn:hover{
    color:#000;
}

.service-tag{
    position:absolute;
    top:15px;
    right:-35px;
    background:#936627;
    color:#fff;
    padding:6px 40px;
    transform:rotate(45deg);
    font-size:12px;
    font-weight:600;
}

.why-section{
    background:#f8fbff;
}

.section-title span{
    color:#936627;
    position:relative;
}

.why-card{
    position:relative;
    background:#fff;
    border-radius:18px;
    padding:35px 30px;
    text-align:center;
    overflow:hidden;
    transition:.4s ease;
    box-shadow:0 10px 30px rgba(0,0,0,.08);
    border:1px solid rgba(13,110,253,.08);
    height:100%;
}

.why-card::before{
    content:'';
    position:absolute;
    top:0;
    left:-100%;
    width:100%;
    height:4px;
    background:linear-gradient(90deg,#936627,#020a13);
    transition:.5s;
}

.why-card:hover::before{
    left:0;
}

.why-card:hover{
    transform:translateY(-10px);
    box-shadow:0 20px 45px rgba(13,110,253,.18);
}

.icon-box{
    width:85px;
    height:85px;
    margin:auto;
    border-radius:50%;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:38px;
    color:#fff;
    background:linear-gradient(135deg,#936627,#020a13);
    margin-bottom:25px;
    transition:.4s;
}

.why-card:hover .icon-box{
    transform:rotateY(180deg);
}

.why-card h4{
    font-weight:700;
    margin-bottom:15px;
}

.why-card p{
    color:#6c757d;
    font-size:15px;
    line-height:28px;
    margin-bottom:0;
}

.hero-slider{
    background:#f8fbff;
    padding:80px 0;
    overflow:hidden;
}

.hero-slider .swiper{
    width:100%;
    height:100%;
}

.swiper-slide{
    min-height:600px;
    display:flex;
    align-items:center;
}

.sub-title{
    color:#0d6efd;
    font-weight:700;
    letter-spacing:2px;
    text-transform:uppercase;
}

.hero-slider h1{
    font-size:60px;
    font-weight:800;
    margin:20px 0;
    line-height:1.2;
}

.hero-slider h1 span{
    color:#0d6efd;
}

.hero-slider p{
    font-size:18px;
    color:#666;
    line-height:32px;
}

.hero-img{
    animation:float 4s ease-in-out infinite;
}

@keyframes float{
    0%,100%{transform:translateY(0);}
    50%{transform:translateY(-18px);}
}

/* Vertical Pagination */

.swiper-pagination{
    right:40px !important;
    left:auto !important;
    top:50% !important;
    transform:translateY(-50%);
    display:flex;
    flex-direction:column;
    gap:18px;
}

.swiper-pagination-bullet{
    width:12px;
    height:12px;
    background:#cfcfcf;
    opacity:1;
    transition:.3s;
}

.swiper-pagination-bullet-active{
    height:40px;
    border-radius:20px;
    background:#0d6efd;
}

@media(max-width:992px){

.hero-slider h1{
    font-size:40px;
}

.swiper-slide{
    min-height:auto;
    padding:40px 0;
    text-align:center;
}

.hero-img{
    margin-top:40px;
}

.swiper-pagination{
    display:none;
}

}