/* Visa application — premium layer (loaded after visa-apply.css and visa-application.css). Markup/JS unchanged apart from the stepper, card heads and date picker. */
:root{--vp-navy:#0c2b3f;--vp-navy-2:#123a53;--vp-teal:#18ae97;--vp-teal-d:#0f8f7b;--vp-mint:#eaf7f4;--vp-mint-2:#d5f0ea;--vp-line:#e3eaee;--vp-muted:#5d6f7c;--vp-gold:#c9a227}

/* ---- summary strip ---- */
.hero-strip{position:relative;overflow:hidden;isolation:isolate;border-radius:24px;padding:22px 26px;gap:18px;margin-bottom:22px;
  background:linear-gradient(125deg,#0b2638 0%,#0f3550 55%,#0d4a52 100%);box-shadow:0 22px 44px -26px rgba(12,43,63,.65)}
.hero-strip::before{content:"";position:absolute;z-index:-1;width:320px;height:320px;border-radius:50%;inset-inline-end:-90px;top:-150px;background:radial-gradient(circle,rgba(43,196,170,.35),transparent 65%)}
.hero-strip::after{content:"";position:absolute;z-index:-1;inset:0;opacity:.06;background-image:radial-gradient(#fff 1px,transparent 1px);background-size:16px 16px}
#hs-flag svg,#hs-flag img{width:58px!important;height:58px!important;border-radius:50%;box-shadow:0 0 0 3px rgba(255,255,255,.9),0 10px 22px -10px rgba(0,0,0,.5)}
.hero-strip .hs-main b{font-size:23px;font-weight:900;letter-spacing:-.01em}
.hero-strip .hs-main small{color:#b9d3df;font-size:14px}
.hs-badges{display:flex;flex-wrap:wrap;gap:8px}
.hs-badges span{display:inline-flex;align-items:center;gap:6px;font-size:12.5px;font-weight:700;color:#dff1f3;padding:6px 12px;border-radius:999px;background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14)}
.hs-badges svg{width:15px;height:15px;color:#7fe0cf}
.hero-strip .hs-price{background:linear-gradient(160deg,rgba(255,255,255,.16),rgba(255,255,255,.06));border:1px solid rgba(255,255,255,.18);border-radius:18px;padding:12px 20px;backdrop-filter:blur(4px)}
.hero-strip .hs-price b{font-size:22px;font-weight:900}

/* ---- stepper ---- */
.vsteps{position:relative;margin:4px 0 26px;padding:18px 18px 16px;background:#fff;border:1px solid var(--vp-line);border-radius:22px;box-shadow:0 10px 30px -22px rgba(12,43,63,.3)}
.vsteps .pbar{position:absolute;top:38px;inset-inline:calc(100% / 6 + 6px);height:3px;border-radius:3px;background:#e7eef2;overflow:hidden}
.vsteps .pbar i{width:0;height:100%;background:linear-gradient(90deg,var(--vp-teal),#3fd3b6);transition:width .45s cubic-bezier(.2,.7,.2,1)}
.vsteps .plabels{position:relative;list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;font-size:inherit}
.vsteps .plabels li{display:flex;flex-direction:column;align-items:center;gap:8px;text-align:center;color:var(--vp-muted)}
.vs-dot{position:relative;width:42px;height:42px;border-radius:50%;display:grid;place-items:center;background:#fff;border:2px solid #d9e3e8;color:#8aa0ad;font-weight:900;font-size:15px;transition:all .3s}
.vs-dot svg{position:absolute;width:20px;height:20px;fill:none;stroke:#fff;stroke-width:2.6;stroke-linecap:round;stroke-linejoin:round;opacity:0;transform:scale(.6);transition:all .3s}
.vs-txt b{display:block;font-size:14.5px;font-weight:800;color:inherit}
.vs-txt small{display:block;font-size:12px;color:#8aa0ad;margin-top:1px}
.plabels li.cur{color:var(--vp-navy)}
.plabels li.cur .vs-dot{border-color:var(--vp-teal);color:var(--vp-teal-d);box-shadow:0 0 0 6px rgba(24,174,151,.14)}
.plabels li.done{color:var(--vp-teal-d)}
.plabels li.done .vs-dot{background:linear-gradient(160deg,#2bc4aa,var(--vp-teal-d));border-color:transparent}
.plabels li.done .vs-dot b{opacity:0}
.plabels li.done .vs-dot svg{opacity:1;transform:none}

/* ---- cards ---- */
.panelcard{border-radius:22px;padding:24px 26px;border-color:var(--vp-line);box-shadow:0 1px 2px rgba(12,43,63,.04),0 14px 34px -26px rgba(12,43,63,.35);margin-bottom:18px}
.pc-head{display:flex;align-items:flex-start;gap:14px;margin-bottom:16px}
.pc-ic{width:46px;height:46px;border-radius:14px;display:grid;place-items:center;flex:none;color:var(--vp-teal-d);background:linear-gradient(160deg,#f1faf8,var(--vp-mint-2));box-shadow:inset 0 0 0 1px rgba(24,174,151,.15)}
.pc-ic svg{width:22px;height:22px}
.pc-head h3{font-size:19px;font-weight:900;margin:2px 0 4px}
.pc-head .hint{margin:0}
.infonote{border-radius:16px}

/* travel window */
#whenchips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
#whenchips .chip{position:relative;display:flex;align-items:center;justify-content:center;gap:8px;min-height:54px;border-radius:16px;padding:12px 14px;font-weight:800;border:1.5px solid var(--vp-line);transition:all .2s}
#whenchips .chip::before{content:"";width:16px;height:16px;border-radius:50%;border:2px solid #cfdbe1;flex:none;transition:all .2s}
#whenchips .chip:hover{border-color:var(--vp-teal);background:#f6fcfb}
#whenchips .chip.sel{background:var(--vp-mint);border-color:var(--vp-teal);color:var(--vp-teal-d);box-shadow:0 10px 22px -16px rgba(15,143,123,.9)}
#whenchips .chip.sel::before{border-color:var(--vp-teal);background:var(--vp-teal);box-shadow:inset 0 0 0 3px #fff}
.datepick{display:grid;gap:8px;margin-top:16px;max-width:440px}
.dp-or{display:flex;align-items:center;gap:10px;font-size:13px;font-weight:700;color:var(--vp-muted)}
.dp-or::after{content:"";flex:1;height:1px;background:var(--vp-line)}
.dp-lbl{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}

/* cities */
.cities{gap:10px}
.citybtn{border-radius:16px;border-width:1.5px;min-height:56px;transition:all .2s}
.citybtn:hover{border-color:var(--vp-teal)}
.citybtn.sel{box-shadow:0 10px 22px -16px rgba(15,143,123,.9)}

/* travellers */
.numchips{gap:10px}
.numchip{width:58px;height:58px;border-radius:18px;border-width:1.5px;font-size:18px;transition:all .2s}
.numchip:hover{border-color:var(--vp-teal);color:var(--vp-teal-d)}
.numchip.sel{background:linear-gradient(160deg,#2bc4aa,var(--vp-teal-d));border-color:transparent;color:#fff;box-shadow:0 12px 24px -14px rgba(15,143,123,.95)}

/* applicant fields */
.f2{gap:16px}
.field label{font-weight:700;color:var(--vp-navy);font-size:14px}
.field input,.field select,.field textarea{min-height:52px;border-radius:14px;border:1.5px solid var(--vp-line);padding:12px 16px;font-size:15px;transition:border-color .2s,box-shadow .2s}
.field input:focus,.field select:focus,.field textarea:focus{border-color:var(--vp-teal);box-shadow:0 0 0 4px rgba(24,174,151,.14)}

/* documents */
.docgroup{border-radius:18px;padding:16px;background:#f7fafb;border-color:var(--vp-line)}
.dghead .num{width:30px;height:30px;background:var(--vp-navy)}
.dghead .dgcount{font-size:12.5px;font-weight:800;color:var(--vp-teal-d);background:var(--vp-mint);padding:3px 10px;border-radius:999px}
.upl{border-radius:14px;border:1.5px dashed #cfdbe1;padding:14px 16px;transition:border-color .2s,background .2s}
.upl:hover{border-color:var(--vp-teal);background:#fbfefd}
.upl .pick{border-radius:999px;padding:8px 18px;background:#fff;border:1.5px solid var(--vp-mint-2);color:var(--vp-teal-d);font-weight:800}
.upl.done{border-style:solid;border-color:var(--vp-teal);background:#f3fbf9}
.badge-ok{background:#f7fafb;border-radius:14px;padding:10px 12px}

/* review */
#review{border:1px solid var(--vp-line);border-radius:18px;padding:6px 18px 4px;background:#fbfdfd}
.sumline{margin:0;padding:12px 0;border-bottom:1px dashed #e3eaee;font-size:14.5px}
.sumline b{color:var(--vp-navy);font-weight:800}
.sumtotal{border-top:0;margin:0;padding:16px 0 14px;font-size:22px}
.sumtotal span:last-child{color:var(--vp-teal-d)}

/* payment */
.paymeth{gap:12px}
.pm{position:relative;border-radius:18px;border-width:1.5px;padding:16px 8px;min-height:88px;transition:all .2s}
.pm:hover{border-color:var(--vp-teal)}
.pm.sel{background:#f2fbf9;box-shadow:0 0 0 1px var(--vp-teal),0 12px 26px -18px rgba(15,143,123,.9)}
.pm.sel::after{content:"";position:absolute;top:8px;inset-inline-end:8px;width:18px;height:18px;border-radius:50%;background:var(--vp-teal) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M6 12.5l4 4L18 8'/%3E%3C/svg%3E") center/12px no-repeat}
.agree,.paylater,.usebal{border-radius:16px;padding:14px 16px}
.secure{justify-content:center;background:#f7fafb;border-radius:14px;padding:10px 12px}

/* ---- sticky action bar ---- */
.stickybar{bottom:12px;margin-top:22px;padding:14px 18px;border:1px solid var(--vp-line);border-radius:22px;background:rgba(255,255,255,.92);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);
  box-shadow:0 18px 40px -22px rgba(12,43,63,.45);padding-inline-end:96px;z-index:30}
.stickybar .tot small{font-weight:700}
.stickybar .tot b{font-size:24px;font-weight:900;color:var(--vp-navy)}
.stickybar .btn{min-width:180px;height:52px;border-radius:16px;font-weight:900;display:inline-flex;align-items:center;justify-content:center;gap:8px}
.backbtn{background:#fff;color:var(--vp-navy);border:1.5px solid #d5e0e6;box-shadow:none}
.backbtn:hover{background:#f3f7f9;border-color:var(--vp-navy)}
.backbtn::before{content:"→";font-weight:900}
#mainbtn{background:linear-gradient(160deg,#20b9a0,var(--vp-teal-d));box-shadow:0 14px 26px -14px rgba(15,143,123,.95)}
#mainbtn:hover{filter:brightness(1.05)}
#mainbtn:not([disabled])::after{content:"←";font-weight:900}
body.is-en .backbtn::before{content:"←"} body.is-en #mainbtn:not([disabled])::after{content:"→"}

@media (max-width:820px){
  #whenchips{grid-template-columns:repeat(2,minmax(0,1fr))}
  .paymeth{grid-template-columns:repeat(2,minmax(0,1fr))}
  .hs-badges{order:3;width:100%}
}
@media (max-width:600px){
  .hero-strip{padding:18px;border-radius:20px}
  .hero-strip .hs-main b{font-size:20px}
  .vsteps{padding:14px 10px 12px}
  .vsteps .pbar{top:33px}
  .vs-dot{width:36px;height:36px;font-size:14px}
  .vs-txt b{font-size:12.5px}
  .vs-txt small{display:none}
  .panelcard{padding:18px 16px;border-radius:20px}
  .pc-ic{width:40px;height:40px;border-radius:12px}
  .pc-head h3{font-size:17px}
  .f2{grid-template-columns:minmax(0,1fr)}
  .numchip{width:48px;height:48px;border-radius:15px}
  .stickybar{bottom:8px;padding:10px 12px;padding-inline-end:12px;border-radius:18px;display:grid;grid-template-columns:auto minmax(0,1fr);align-items:center;gap:10px}
  .stickybar .tot small{font-size:11.5px}
  .stickybar .tot b{font-size:18px;white-space:nowrap}
  .stickybar .navbtns{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px}
  .stickybar .btn{min-width:0;height:46px;border-radius:14px;padding:0 14px;font-size:14.5px}
  /* the call/WhatsApp bubbles sit above the action bar on this page */
  body:has(#vaForm) .fab-stack{bottom:96px!important}
}
@media (prefers-reduced-motion:reduce){.vsteps .pbar i,.vs-dot,.vs-dot svg,#whenchips .chip,.numchip,.pm{transition:none}}