/* ==========================================================================
   DummyTicketsIndia — design system
   Direction: airline ticketing artifacts. Boarding-pass card, split-flap
   departure-board type, monospace record locators, perforated tear lines.
   ========================================================================== */

:root{
  --ink:#0A1B2A;
  --ink-2:#102B3F;
  --ink-3:#1C3A50;
  --emerald:#0E9F6E;
  --emerald-deep:#076F4C;
  --emerald-wash:#E4F5EE;
  --amber:#F5A524;
  --amber-deep:#B77400;
  --paper:#F2F5F4;
  --white:#FFFFFF;
  --line:#DCE4E2;
  --muted:#5B6D72;

  --wrap:1180px;
  --r-sm:8px;
  --r:14px;
  --r-lg:22px;

  --shadow-1:0 1px 2px rgba(10,27,42,.06), 0 4px 14px rgba(10,27,42,.06);
  --shadow-2:0 18px 50px rgba(10,27,42,.14);

  --display:'Bricolage Grotesque', 'Instrument Sans', system-ui, sans-serif;
  --body:'Instrument Sans', system-ui, -apple-system, 'Segoe UI', sans-serif;
  --mono:'IBM Plex Mono', ui-monospace, 'SF Mono', Menlo, monospace;
}

*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth; -webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--paper); color:var(--ink);
  font-family:var(--body); font-size:17px; line-height:1.65;
  -webkit-font-smoothing:antialiased; overflow-x:hidden;
}
img{max-width:100%; display:block}
a{color:var(--emerald-deep); text-decoration:none}
a:hover{text-decoration:underline}
:focus-visible{outline:3px solid var(--amber); outline-offset:3px; border-radius:4px}

h1,h2,h3,h4{font-family:var(--display); font-weight:800; letter-spacing:-.02em; line-height:1.12; margin:0 0 .5em}
h1{font-size:clamp(2rem,4.6vw,3.25rem)}
h2{font-size:clamp(1.65rem,3.4vw,2.5rem)}
h3{font-size:clamp(1.15rem,2vw,1.45rem); letter-spacing:-.01em}
h4{font-size:1.05rem; letter-spacing:0}
p{margin:0 0 1.1em}
strong{font-weight:700}

.wrap{width:100%; max-width:var(--wrap); margin-inline:auto; padding-inline:20px}
.narrow{max-width:820px}
.section{padding:76px 0}
.section-sm{padding:52px 0}
.bg-white{background:var(--white)}
.bg-wash{background:var(--emerald-wash)}
.bg-ink{background:var(--ink); color:#DEE9EC}
.bg-ink h2,.bg-ink h3{color:#fff}
.center{text-align:center}
.mono{font-family:var(--mono)}

/* ---------- eyebrow: mono, tracked, used as a data label ---------- */
.eyebrow{
  font-family:var(--mono); font-size:.72rem; font-weight:600;
  letter-spacing:.22em; text-transform:uppercase; color:var(--emerald-deep);
  margin:0 0 14px; display:block;
}
.bg-ink .eyebrow{color:var(--amber)}

.lede{font-size:1.12rem; color:var(--muted); max-width:66ch}
.bg-ink .lede{color:#A9C0C7}
.center .lede{margin-inline:auto}

/* ---------- top strip + nav ---------- */
.topbar{
  background:var(--ink); color:#9FBAC2; font-family:var(--mono);
  font-size:.74rem; letter-spacing:.08em; text-transform:uppercase;
}
.topbar .wrap{display:flex; gap:18px; justify-content:space-between; align-items:center; min-height:36px; flex-wrap:wrap}
.topbar a{color:#CFE3E8}
.topbar b{color:var(--amber); font-weight:600}

.nav{position:sticky; top:0; z-index:60; background:rgba(255,255,255,.92); backdrop-filter:blur(12px); border-bottom:1px solid var(--line)}
.nav .wrap{display:flex; align-items:center; gap:16px; min-height:68px}
.brand{font-family:var(--display); font-weight:800; font-size:1.3rem; letter-spacing:-.03em; color:var(--ink)}
.brand:hover{text-decoration:none}
.brand span{color:var(--emerald)}
.nav-links{display:flex; align-items:center; gap:4px; margin-left:auto; list-style:none; padding:0; margin-block:0}
.nav-links a{
  display:block; padding:9px 13px; border-radius:99px; font-size:.94rem;
  font-weight:600; color:var(--ink-3);
}
.nav-links a:hover{background:var(--emerald-wash); color:var(--emerald-deep); text-decoration:none}
.nav-links a[aria-current="page"]{color:var(--emerald-deep); background:var(--emerald-wash)}
.nav-toggle{display:none; margin-left:auto; background:none; border:1px solid var(--line); border-radius:10px; padding:9px 12px; font-size:1.1rem; cursor:pointer}

@media(max-width:960px){
  .nav-toggle{display:block}
  .nav-links{
    position:absolute; top:100%; left:0; right:0; background:var(--white);
    flex-direction:column; align-items:stretch; gap:2px; padding:12px 16px 20px;
    border-bottom:1px solid var(--line); box-shadow:var(--shadow-2); display:none;
  }
  .nav-links.open{display:flex}
  .nav-links a{padding:12px 14px}
  .nav-links .btn{text-align:center}
}

/* ---------- buttons ---------- */
.btn{
  display:inline-flex; align-items:center; justify-content:center; gap:9px;
  font-family:var(--body); font-weight:700; font-size:1rem; line-height:1;
  padding:15px 26px; border-radius:99px; border:1.5px solid transparent;
  cursor:pointer; transition:transform .18s ease, box-shadow .18s ease, background .18s ease;
}
.btn:hover{text-decoration:none; transform:translateY(-2px)}
.btn-primary{background:var(--emerald); color:#fff; box-shadow:0 8px 22px rgba(14,159,110,.32)}
.btn-primary:hover{background:var(--emerald-deep); color:#fff}
.btn-ink{background:var(--ink); color:#fff}
.btn-ink:hover{background:var(--ink-2); color:#fff}
.btn-amber{background:var(--amber); color:#3A2600}
.btn-amber:hover{background:#FFB93F; color:#3A2600}
.btn-ghost{background:transparent; color:var(--ink); border-color:var(--line)}
.bg-ink .btn-ghost,.hero .btn-ghost,.cta-band .btn-ghost,.phead .btn-ghost{color:#fff; border-color:rgba(255,255,255,.32)}
.hero .btn-ghost:hover,.cta-band .btn-ghost:hover{background:rgba(255,255,255,.1); color:#fff}
.btn-lg{padding:18px 34px; font-size:1.06rem}
.btn-block{display:flex; width:100%}
.btn-row{display:flex; gap:12px; flex-wrap:wrap}
.center .btn-row{justify-content:center}

/* ---------- hero ---------- */
.hero{
  background:
    radial-gradient(900px 420px at 12% -10%, rgba(14,159,110,.30), transparent 62%),
    radial-gradient(700px 400px at 96% 6%, rgba(245,165,36,.16), transparent 60%),
    linear-gradient(168deg, #06121D 0%, #0A1B2A 46%, #0D2436 100%);
  color:#fff; padding:66px 0 96px; position:relative; overflow:hidden;
}
.hero::after{
  content:''; position:absolute; inset:0; pointer-events:none; opacity:.5;
  background-image:linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px),
                   linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px);
  background-size:64px 64px;
  -webkit-mask-image:radial-gradient(70% 60% at 50% 30%, #000, transparent 80%);
          mask-image:radial-gradient(70% 60% at 50% 30%, #000, transparent 80%);
}
.hero .wrap{position:relative; z-index:2}
.hero-grid{display:grid; grid-template-columns:1.02fr .98fr; gap:52px; align-items:center}
.hero h1{color:#fff}
.hero h1 em{font-style:normal; color:#4FD8A6}
.hero p{color:#B7CDD4; font-size:1.12rem; max-width:56ch}
.hero-chips{display:flex; flex-wrap:wrap; gap:9px; margin-top:26px; padding:0; list-style:none}
.hero-chips li{
  font-family:var(--mono); font-size:.74rem; letter-spacing:.1em; text-transform:uppercase;
  color:#CFE7DE; border:1px solid rgba(255,255,255,.18); background:rgba(255,255,255,.05);
  padding:8px 13px; border-radius:99px;
}
@media(max-width:900px){ .hero-grid{grid-template-columns:1fr; gap:38px} .hero{padding:44px 0 70px} }

/* ---------- signature: boarding pass card ---------- */
.pass{
  background:var(--white); color:var(--ink); border-radius:var(--r-lg);
  box-shadow:var(--shadow-2); overflow:hidden; display:grid;
  grid-template-columns:1fr 132px; position:relative;
}
.pass-main{padding:26px 24px 22px}
.pass-head{display:flex; justify-content:space-between; align-items:center; gap:12px; border-bottom:1px dashed var(--line); padding-bottom:14px; margin-bottom:18px}
.pass-air{font-family:var(--display); font-weight:800; letter-spacing:-.02em; font-size:1.02rem}
.pass-air span{color:var(--emerald)}
.pass-tag{font-family:var(--mono); font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted)}

.pass-route{display:grid; grid-template-columns:1fr auto 1fr; align-items:center; gap:10px}
.pass-code{font-family:var(--display); font-size:2.6rem; font-weight:800; letter-spacing:-.04em; line-height:1}
.pass-city{font-family:var(--mono); font-size:.7rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); margin-top:4px}
.pass-arrow{color:var(--emerald); font-size:1.3rem}
.pass-route div:last-child{text-align:right}

.pass-rows{display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-top:22px; padding-top:18px; border-top:1px dashed var(--line)}
.pass-rows dt{font-family:var(--mono); font-size:.63rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
.pass-rows dd{margin:3px 0 0; font-weight:700; font-size:.98rem}

/* perforated stub */
.pass-stub{
  background:linear-gradient(160deg,var(--emerald-deep),#065B40); color:#fff; padding:22px 16px; display:flex;
  flex-direction:column; justify-content:space-between; align-items:center; text-align:center;
  position:relative;
}
.pass-stub::before{
  content:''; position:absolute; left:0; top:0; bottom:0; width:0;
  border-left:2px dashed rgba(255,255,255,.35);
}
.pass-stub .amt{font-family:var(--display); font-size:1.9rem; font-weight:800; letter-spacing:-.03em}
.pass-stub .amt small{display:block; font-family:var(--mono); font-size:.6rem; letter-spacing:.14em; color:#8FB3BD; font-weight:500; margin-top:5px}
.pass-barcode{
  width:100%; height:44px; margin-top:14px;
  background:repeating-linear-gradient(90deg,#fff 0 2px, transparent 2px 4px, #fff 4px 5px, transparent 5px 9px);
  opacity:.85;
}
/* split-flap PNR */
.flap{display:inline-flex; gap:3px}
.flap span{
  display:inline-block; min-width:19px; padding:5px 3px; border-radius:4px;
  background:#06111C; color:var(--amber); font-family:var(--mono); font-weight:600;
  font-size:.92rem; text-align:center; box-shadow:inset 0 -1px 0 rgba(255,255,255,.14);
}
.flap.flip span{animation:flap .5s cubic-bezier(.2,.8,.3,1) both}
@keyframes flap{ from{transform:rotateX(-88deg); opacity:0} to{transform:rotateX(0); opacity:1} }
@media(max-width:520px){ .pass{grid-template-columns:1fr} .pass-stub{flex-direction:row; gap:16px; padding:18px} .pass-stub::before{left:0;right:0;top:0;bottom:auto;width:auto;height:0;border-left:0;border-top:2px dashed rgba(255,255,255,.35)} .pass-barcode{margin-top:0; width:110px} .pass-rows{grid-template-columns:1fr 1fr} }

/* ---------- departure board strip ---------- */
.board{background:#06111C; padding:14px 0; overflow:hidden; border-block:1px solid rgba(255,255,255,.08)}
.board-track{display:flex; gap:38px; width:max-content; animation:slide 42s linear infinite}
.board-track span{
  font-family:var(--mono); font-size:.82rem; letter-spacing:.14em; text-transform:uppercase;
  color:var(--amber); white-space:nowrap;
}
.board-track span i{color:#4FD8A6; font-style:normal; margin-inline:6px}
@keyframes slide{ from{transform:translateX(0)} to{transform:translateX(-50%)} }

/* ---------- generic cards / grids ---------- */
.grid{display:grid; gap:20px}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
@media(max-width:980px){ .g4{grid-template-columns:repeat(2,1fr)} .g3{grid-template-columns:repeat(2,1fr)} }
@media(max-width:620px){ .g4,.g3,.g2{grid-template-columns:1fr} }

.card{
  background:var(--white); border:1px solid var(--line); border-radius:var(--r);
  padding:26px 24px; box-shadow:var(--shadow-1);
  transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease;
}
.card:hover{transform:translateY(-4px); box-shadow:var(--shadow-2); border-color:#BFD8CF}
.card h3{margin-bottom:.4em}
.card p:last-child{margin-bottom:0}
.card .ico{
  width:44px; height:44px; border-radius:12px; display:grid; place-items:center;
  background:var(--emerald-wash); color:var(--emerald-deep); font-size:1.25rem; margin-bottom:16px;
}
.card-link{display:block; color:inherit}
.card-link:hover{text-decoration:none}

/* numbered sequence — order genuinely matters here */
.steps{counter-reset:s; display:grid; gap:20px; grid-template-columns:repeat(3,1fr)}
@media(max-width:820px){ .steps{grid-template-columns:1fr} }
.step{background:var(--white); border:1px solid var(--line); border-radius:var(--r); padding:28px 24px; position:relative}
.step::before{
  counter-increment:s; content:counter(s,decimal-leading-zero);
  font-family:var(--mono); font-size:.78rem; letter-spacing:.16em; color:var(--emerald);
  display:block; margin-bottom:12px;
}

/* spec table — reads like ticket data */
.spec{width:100%; border-collapse:collapse; background:var(--white); border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
.spec th,.spec td{padding:14px 18px; text-align:left; border-bottom:1px solid var(--line); font-size:.97rem; vertical-align:top}
.spec thead th{background:var(--ink); color:#fff; font-family:var(--mono); font-size:.7rem; letter-spacing:.14em; text-transform:uppercase; font-weight:600}
.spec tbody tr:last-child td{border-bottom:0}
.spec tbody th{font-weight:700; width:34%}
.spec .yes{color:var(--emerald-deep); font-weight:700}
.spec .no{color:#C0392B; font-weight:700}
.table-scroll{overflow-x:auto; -webkit-overflow-scrolling:touch}
.table-scroll .spec{min-width:640px}

/* pill link grid (visa countries / routes) */
.pills{display:flex; flex-wrap:wrap; gap:10px; padding:0; list-style:none; margin:0}
.pills a{
  display:inline-block; padding:11px 17px; border-radius:99px; background:var(--white);
  border:1px solid var(--line); color:var(--ink); font-weight:600; font-size:.93rem;
}
.pills a:hover{border-color:var(--emerald); color:var(--emerald-deep); background:var(--emerald-wash); text-decoration:none}

/* prose blocks for long-form SEO copy */
.prose{max-width:74ch}
.prose h2{margin-top:1.6em}
.prose h3{margin-top:1.5em}
.prose ul,.prose ol{padding-left:1.25em; margin:0 0 1.2em}
.prose li{margin-bottom:.5em}
.prose blockquote{
  margin:1.6em 0; padding:18px 22px; border-left:3px solid var(--emerald);
  background:var(--white); border-radius:0 var(--r-sm) var(--r-sm) 0; color:var(--ink-3);
}
.prose table{width:100%; border-collapse:collapse; margin:1.4em 0; font-size:.95rem}
.prose th,.prose td{border:1px solid var(--line); padding:11px 14px; text-align:left; background:var(--white)}
.prose th{background:var(--emerald-wash)}

/* FAQ — native details, no JS, crawlable */
.faq{display:grid; gap:12px}
.faq details{background:var(--white); border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
.faq summary{
  cursor:pointer; list-style:none; padding:18px 52px 18px 20px; font-weight:700;
  font-family:var(--display); font-size:1.04rem; position:relative;
}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{
  content:'+'; position:absolute; right:20px; top:50%; transform:translateY(-50%);
  font-family:var(--mono); font-size:1.3rem; color:var(--emerald); line-height:1;
}
.faq details[open] summary::after{content:'–'}
.faq details[open] summary{background:var(--emerald-wash)}
.faq .a{padding:4px 20px 20px; color:var(--muted)}
.faq .a p:last-child{margin-bottom:0}

/* reviews */
.review{background:var(--white); border:1px solid var(--line); border-radius:var(--r); padding:24px}
.review .stars{color:var(--amber); letter-spacing:2px; font-size:.95rem}
.review p{margin:12px 0 14px; font-size:.98rem}
.review cite{font-style:normal; font-weight:700; font-size:.9rem}
.review cite small{display:block; font-family:var(--mono); font-size:.68rem; letter-spacing:.12em; text-transform:uppercase; color:var(--muted); font-weight:500; margin-top:3px}

/* stats */
.stats{display:grid; grid-template-columns:repeat(4,1fr); gap:1px; background:var(--line); border:1px solid var(--line); border-radius:var(--r); overflow:hidden}
.stats div{background:var(--white); padding:24px 18px; text-align:center}
.stats b{display:block; font-family:var(--display); font-size:1.9rem; font-weight:800; letter-spacing:-.03em; color:var(--emerald-deep)}
.stats span{font-family:var(--mono); font-size:.66rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted)}
@media(max-width:700px){ .stats{grid-template-columns:1fr 1fr} }

/* price card */
.price{background:var(--white); border:2px solid var(--emerald); border-radius:var(--r-lg); padding:34px 30px; box-shadow:var(--shadow-2); text-align:center; max-width:420px; margin-inline:auto}
.price .amt{font-family:var(--display); font-size:3.4rem; font-weight:800; letter-spacing:-.04em; line-height:1; color:var(--ink)}
.price .per{font-family:var(--mono); font-size:.72rem; letter-spacing:.14em; text-transform:uppercase; color:var(--muted); display:block; margin-top:8px}
.price ul{list-style:none; padding:0; margin:24px 0; text-align:left; display:grid; gap:11px}
.price li{padding-left:28px; position:relative; font-size:.97rem}
.price li::before{content:'✓'; position:absolute; left:0; color:var(--emerald); font-weight:700}

/* breadcrumbs */
.crumbs{font-family:var(--mono); font-size:.72rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); padding:18px 0 0}
.crumbs a{color:var(--muted)}
.crumbs a:hover{color:var(--emerald-deep)}

/* page header */
.phead{background:linear-gradient(168deg,#06121D,#0D2436); color:#fff; padding:50px 0 56px}
.phead h1{color:#fff; margin-bottom:.3em}
.phead p{color:#B7CDD4; max-width:62ch; margin:0}
.phead .crumbs{color:#7F9AA3; padding-top:0; margin-bottom:18px}
.phead .crumbs a{color:#7F9AA3}

/* CTA band */
.cta-band{background:linear-gradient(120deg,var(--emerald-deep),#0B7F5C 55%,#0A6B4F); color:#fff; border-radius:var(--r-lg); padding:44px 40px; text-align:center}
.cta-band h2{color:#fff; margin-bottom:.35em}
.cta-band p{color:#CDEFE2; max-width:56ch; margin-inline:auto}
@media(max-width:620px){ .cta-band{padding:32px 22px} }

/* footer */
.foot{background:var(--ink); color:#9FBAC2; padding:60px 0 28px; font-size:.94rem}
.foot h4{color:#fff; font-family:var(--mono); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase; margin-bottom:16px; font-weight:600}
.foot a{color:#9FBAC2; display:block; padding:5px 0}
.foot a:hover{color:var(--amber); text-decoration:none}
.foot-grid{display:grid; grid-template-columns:1.5fr 1fr 1fr 1fr; gap:34px}
@media(max-width:860px){ .foot-grid{grid-template-columns:1fr 1fr} }
@media(max-width:520px){ .foot-grid{grid-template-columns:1fr} }
.foot-brand{font-family:var(--display); font-weight:800; font-size:1.35rem; color:#fff; letter-spacing:-.03em}
.foot-brand span{color:var(--emerald)}
.foot-note{border-top:1px solid rgba(255,255,255,.1); margin-top:40px; padding-top:22px; font-size:.83rem; color:#7F9AA3}

/* floating whatsapp + mobile sticky CTA */
.wa{
  position:fixed; right:18px; bottom:18px; z-index:70; width:56px; height:56px;
  border-radius:50%; background:#25D366; color:#fff; display:grid; place-items:center;
  font-size:1.6rem; box-shadow:0 10px 26px rgba(37,211,102,.4);
}
.wa:hover{text-decoration:none; transform:scale(1.06)}
.sticky-cta{display:none}
@media(max-width:760px){
  .wa{bottom:80px; width:50px; height:50px; font-size:1.4rem}
  .sticky-cta{
    display:flex; position:fixed; left:0; right:0; bottom:0; z-index:75;
    background:var(--white); border-top:1px solid var(--line); padding:10px 14px;
    gap:10px; align-items:center; box-shadow:0 -6px 20px rgba(10,27,42,.1);
  }
  .sticky-cta .p{font-family:var(--mono); font-size:.68rem; letter-spacing:.1em; text-transform:uppercase; color:var(--muted); line-height:1.4}
  .sticky-cta .p b{display:block; font-family:var(--display); font-size:1.15rem; color:var(--ink); letter-spacing:-.02em}
  .sticky-cta .btn{flex:1; padding:14px 18px}
  body{padding-bottom:74px}
}

/* scroll reveal */
.rise{opacity:0; transform:translateY(18px); transition:opacity .6s ease, transform .6s ease}
.rise.in{opacity:1; transform:none}

@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none !important; transition:none !important; scroll-behavior:auto !important}
  .rise{opacity:1; transform:none}
}

/* ---------- booking page form skin (works with Bootstrap grid) ---------- */
.form-card{background:var(--white); border:1px solid var(--line); border-radius:var(--r-lg); padding:32px 30px; box-shadow:var(--shadow-2)}
@media(max-width:620px){ .form-card{padding:22px 18px} }
.form-legend{
  font-family:var(--mono); font-size:.7rem; letter-spacing:.16em; text-transform:uppercase;
  color:var(--emerald-deep); display:flex; align-items:center; gap:9px; margin:30px 0 14px;
}
.form-legend::after{content:''; flex:1; height:1px; background:var(--line)}
.form-card .form-label{font-size:.78rem; font-weight:700; color:var(--ink-3); margin-bottom:6px; letter-spacing:.01em}
.form-card .form-control,.form-card .form-select{
  border:1.5px solid var(--line); border-radius:10px; padding:12px 14px; font-size:.97rem;
  font-family:var(--body); background:#FBFCFC; color:var(--ink);
}
.form-card .form-control:focus,.form-card .form-select:focus{
  border-color:var(--emerald); box-shadow:0 0 0 4px rgba(14,159,110,.13); background:#fff; outline:none;
}
.trip-type{display:inline-flex; background:#EDF2F1; border-radius:99px; padding:5px; gap:4px; flex-wrap:wrap; margin-bottom:8px}
.trip-type input{position:absolute; opacity:0; pointer-events:none}
.trip-type label{
  padding:11px 22px; border-radius:99px; cursor:pointer; font-weight:700; font-size:.92rem;
  color:var(--ink-3); transition:.2s; margin:0;
}
.trip-type input:checked+label{background:var(--ink); color:#fff; box-shadow:var(--shadow-1)}
.dynamic-block{background:#F7FAF9; border:1px solid var(--line); border-radius:var(--r); padding:18px; margin-bottom:14px; position:relative}
.btn-add{
  background:transparent; border:1.5px dashed var(--emerald); color:var(--emerald-deep);
  border-radius:10px; padding:11px 18px; font-weight:700; font-size:.9rem; cursor:pointer; width:100%;
}
.btn-add:hover{background:var(--emerald-wash)}
.remove-btn{
  position:absolute; top:10px; right:10px; width:26px; height:26px; border-radius:50%;
  background:#FDE8E6; color:#C0392B; display:grid; place-items:center; cursor:pointer; font-size:.9rem;
}
.section-divider{height:1px; background:var(--line); margin:28px 0}
.btn-submit{
  width:100%; margin-top:26px; background:var(--emerald); color:#fff; border:none;
  border-radius:99px; padding:18px; font-family:var(--body); font-weight:700; font-size:1.08rem;
  cursor:pointer; box-shadow:0 10px 26px rgba(14,159,110,.32); transition:.2s;
}
.btn-submit:hover{background:var(--emerald-deep); transform:translateY(-2px)}
.btn-submit:disabled{opacity:.7; cursor:not-allowed; transform:none}
.was-validated .form-control:invalid,.was-validated .form-select:invalid{border-color:#C0392B; background:#FFF7F6}
.ui-autocomplete{
  border-radius:12px; border:1px solid var(--line); box-shadow:var(--shadow-2); padding:8px;
  background:#fff; font-family:var(--body); z-index:9999; max-height:320px; overflow-y:auto;
}
.ui-menu-item-wrapper{padding:11px 13px; border-radius:8px; font-size:.9rem; color:var(--ink)}
.ui-state-active,.ui-widget-content .ui-state-active{background:var(--emerald-wash)!important; border:none!important; color:var(--emerald-deep)!important; font-weight:700!important}
.ui-helper-hidden-accessible{display:none}
.ui-datepicker{border-radius:12px; box-shadow:var(--shadow-2); font-family:var(--body); z-index:9999!important}

/* trust rail beside form */
.rail{display:grid; gap:14px; position:sticky; top:88px}
.rail .card{padding:20px}
.rail h4{font-family:var(--mono); font-size:.68rem; letter-spacing:.16em; text-transform:uppercase; color:var(--muted); margin-bottom:12px}
.rail ul{list-style:none; padding:0; margin:0; display:grid; gap:9px; font-size:.92rem}
.rail li{padding-left:24px; position:relative}
.rail li::before{content:'✓'; position:absolute; left:0; color:var(--emerald); font-weight:700}
@media(max-width:992px){ .rail{position:static; margin-top:26px} }


/* ==========================================================================
   Minimal grid + form utilities for the booking form.
   Kept local so the booking page never depends on a third-party CSS CDN.
   ========================================================================== */
.row{display:flex; flex-wrap:wrap; margin-inline:-12px}
.row > *{width:100%; padding-inline:12px}
.g-3{row-gap:16px}
.g-4{row-gap:24px}
.row.g-3 > *,.row.g-4 > *{margin-bottom:0}
.col-1{width:8.3333%}
.col-2{width:16.6667%}
.col-3{width:25.0000%}
.col-4{width:33.3333%}
.col-5{width:41.6667%}
.col-6{width:50.0000%}
.col-7{width:58.3333%}
.col-8{width:66.6667%}
.col-9{width:75.0000%}
.col-10{width:83.3333%}
.col-11{width:91.6667%}
.col-12{width:100.0000%}
@media(min-width:768px){
  .col-md-1{width:8.3333%}
  .col-md-2{width:16.6667%}
  .col-md-3{width:25.0000%}
  .col-md-4{width:33.3333%}
  .col-md-5{width:41.6667%}
  .col-md-6{width:50.0000%}
  .col-md-7{width:58.3333%}
  .col-md-8{width:66.6667%}
  .col-md-9{width:75.0000%}
  .col-md-10{width:83.3333%}
  .col-md-11{width:91.6667%}
  .col-md-12{width:100.0000%}
}
@media(min-width:992px){
  .col-lg-1{width:8.3333%}
  .col-lg-2{width:16.6667%}
  .col-lg-3{width:25.0000%}
  .col-lg-4{width:33.3333%}
  .col-lg-5{width:41.6667%}
  .col-lg-6{width:50.0000%}
  .col-lg-7{width:58.3333%}
  .col-lg-8{width:66.6667%}
  .col-lg-9{width:75.0000%}
  .col-lg-10{width:83.3333%}
  .col-lg-11{width:91.6667%}
  .col-lg-12{width:100.0000%}
}
.form-label{display:block}
.form-control,.form-select{display:block; width:100%; font-size:1rem; line-height:1.5; background-clip:padding-box}
.form-select{appearance:none; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill='none' stroke='%235B6D72' stroke-width='2' d='M2 5l6 6 6-6'/%3E%3C/svg%3E"); background-repeat:no-repeat; background-position:right 14px center; background-size:13px; padding-right:38px}
.form-check{display:flex; align-items:flex-start; gap:10px}
.form-check.text-center{justify-content:center; align-items:center}
.form-check-input{width:19px; height:19px; margin:0; accent-color:var(--emerald); flex:none}
.form-check-label{font-size:.92rem; color:var(--muted)}
.float-none{float:none}
.mb-3{margin-bottom:16px}
.mt-2{margin-top:8px}
.mt-4{margin-top:24px}
.ms-2{margin-left:8px}
.text-center{text-align:center}
.small{font-size:.88rem}

/* Booking form column widths — the 12-col defaults are too tight for date fields */
@media(min-width:768px){
  .form-card #simple-route > .col-md-4{width:30%}
  .form-card #simple-route > .col-md-2{width:20%}
  .form-card .passenger-block .row > .col-md-2:nth-child(1){width:12%}
  .form-card .passenger-block .row > .col-md-3{width:25%}
  .form-card .passenger-block .row > .col-md-2:nth-child(4){width:19%}
  .form-card .passenger-block .row > .col-md-2:nth-child(5){width:19%}
}

@media(max-width:600px){
  .topbar .wrap span + span{display:none}
  .topbar .wrap{justify-content:center}
}