:root {
  /* Brand: taken from the office sign — cream "Travel", red "Pro", charcoal-brown wall.
     --brand   sign red for the logo and marks.
     --accent  button red; white text on it meets WCAG AA.
     --red     slightly deeper red for small text and links on white (name kept for compatibility).
     --cream / --char  sign lettering and wall; used for the header, footer and soft tints. */
  --brand: #e0341f;
  --accent: #d2301c;
  --accent-hover: #b02614;
  --on-accent: #ffffff;
  --red: #bf2b17;
  --red-dark: #9a2111;
  --red-soft: #fbf1e4;
  --headline-accent: #d2301c;
  --cream: #f6e6cb;
  --char: #231f1c;
  --char-2: #2e2925;
  --danger: #c0392b;
  --danger-soft: #fdecea;
  --ink: #231f1c;      /* warm charcoal from the sign wall */
  --muted: #6b6159;    /* warm brown-grey, ~5.5:1 on white and cream */
  --line: #ebe3d8;
  --bg: #ffffff;
  --bg-alt: #f8f8f8;
  --radius: 10px;
  --maxw: 1120px;
  --font: "Inter", "Hind Siliguri", system-ui, -apple-system, "Segoe UI", sans-serif;
}
html[lang="bn"] { --font: "Hind Siliguri", "Inter", system-ui, sans-serif; }
html[lang="bn"] body { line-height: 1.75; }

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }
body { margin: 0; font-family: var(--font); color: var(--ink); background: var(--bg); font-size: 16px; line-height: 1.6; }
img { max-width: 100%; }
a { color: var(--red); }
a:hover { color: var(--red-dark); }
:focus-visible { outline: 3px solid var(--red); outline-offset: 2px; border-radius: 4px; }
h1, h2, h3 { line-height: 1.2; margin: 0 0 .5em; letter-spacing: -.01em; }
h1 { font-size: clamp(2rem, 5vw, 3.25rem); font-weight: 700; }
h2 { font-size: clamp(1.5rem, 3.2vw, 2.1rem); font-weight: 700; }
h3 { font-size: 1.15rem; font-weight: 600; }
p { margin: 0 0 1em; }
.muted { color: var(--muted); }
.small { font-size: .875rem; }
.container { width: 100%; max-width: var(--maxw); margin: 0 auto; padding: 0 20px; }
.skip { position: absolute; left: -999px; top: 8px; background: var(--ink); color: #fff; padding: 8px 12px; z-index: 100; }
.skip:focus { left: 8px; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Header */
.site-header { position: sticky; top: 0; background: rgba(255,255,255,.96); border-bottom: 1px solid var(--line); z-index: 20; backdrop-filter: saturate(1.4) blur(6px); }
.site-header .container { display: flex; align-items: center; gap: 24px; height: 68px; }
.logo { display: inline-flex; align-items: flex-start; font-family: "Poppins", "Inter", sans-serif; font-style: italic; font-weight: 800; font-size: 1.5rem; line-height: 1; color: var(--ink); text-decoration: none; letter-spacing: -.035em; white-space: nowrap; padding-top: 4px; }
.logo .lp { color: var(--brand); margin-left: .12em; }
.logo .lplane { width: 1.3em; height: .78em; margin: -.42em 0 0 -.25em; fill: var(--ink); overflow: visible; }
.logo .ltrail { fill: none; stroke: var(--ink); stroke-width: 1.6; stroke-dasharray: 3 2.4; stroke-linecap: round; }
.logo .lspark { fill: var(--brand); }
.logo:hover { color: var(--ink); }
.nav { display: flex; gap: 22px; margin-left: auto; }
.nav a { color: var(--ink); text-decoration: none; font-weight: 500; font-size: .95rem; }
.nav a:hover { color: var(--red); }
.lang-toggle { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 6px 14px; font: inherit; font-size: .875rem; font-weight: 600; cursor: pointer; }
.lang-toggle:hover { border-color: var(--ink); }
.menu-btn { display: none; background: none; border: 0; font: inherit; font-size: 1.5rem; cursor: pointer; padding: 4px 8px; }
@media (max-width: 820px) {
  .menu-btn { display: block; margin-left: auto; }
  .nav { display: none; position: absolute; top: 68px; left: 0; right: 0; background: #fff; flex-direction: column; gap: 0; border-bottom: 1px solid var(--line); margin: 0; }
  .nav.open { display: flex; }
  .nav a { padding: 14px 20px; border-top: 1px solid var(--line); }
  .lang-toggle { margin-left: 0; }
}

/* Buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 13px 22px; border-radius: 8px; font: inherit; font-weight: 600; font-size: 1rem; text-decoration: none; cursor: pointer; border: 2px solid transparent; transition: background .15s, color .15s, border-color .15s; }
.btn-primary { background: var(--red); color: #fff; }
.btn-primary:hover { background: var(--red-dark); color: #fff; }
.btn-outline { background: #fff; color: var(--ink); border-color: var(--ink); }
.btn-outline:hover { background: var(--ink); color: #fff; }
.btn-ghost { background: none; color: var(--ink); border-color: var(--line); }
.btn-ghost:hover { border-color: var(--ink); color: var(--ink); }
.btn-sm { padding: 8px 14px; font-size: .9rem; }
.btn[disabled] { opacity: .5; cursor: not-allowed; }
.actions { display: flex; flex-wrap: wrap; gap: 12px; }

/* Sections */
section { padding: 80px 0; }
section.alt { background: var(--bg-alt); }
.eyebrow { color: var(--red); font-weight: 700; font-size: .8rem; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 10px; }
html[lang="bn"] .eyebrow { letter-spacing: 0; font-size: .9rem; }
.section-head { max-width: 640px; margin-bottom: 40px; }

.hero { padding: 96px 0 88px; }
.hero .lead { font-size: 1.2rem; color: var(--muted); max-width: 600px; margin-bottom: 32px; }
.hero h1 .accent { color: var(--red); }
.hero-meta { margin-top: 28px; color: var(--muted); font-size: .9rem; }

.grid { display: grid; gap: 24px; }
.grid-2 { grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); }
.card { border: 1px solid var(--line); border-radius: var(--radius); padding: 28px; background: #fff; }
.card .icon { width: 44px; height: 44px; border-radius: 10px; background: var(--red-soft); color: var(--red); display: grid; place-items: center; margin-bottom: 16px; }
.card ul { padding-left: 1.2em; margin: 0 0 1em; color: var(--muted); }
.card li { margin-bottom: 4px; }

.airlines { margin-top: 40px; padding-top: 32px; border-top: 1px solid var(--line); }
.airline-list { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; padding: 0; margin: 12px 0; }
.airline-list li { border: 1px solid var(--line); border-radius: 999px; padding: 6px 14px; font-size: .9rem; background: #fff; }

.steps { counter-reset: step; list-style: none; padding: 0; display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.steps li { counter-increment: step; padding-top: 8px; }
.steps li::before { content: counter(step); display: inline-grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--ink); color: #fff; font-weight: 700; margin-bottom: 10px; }

/* Forms */
.form { display: grid; gap: 28px; }
fieldset { border: 1px solid var(--line); border-radius: var(--radius); padding: 22px; margin: 0; background: #fff; }
legend { font-weight: 700; padding: 0 8px; }
.fields { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); }
.field { display: flex; flex-direction: column; gap: 6px; }
.field.full { grid-column: 1 / -1; }
label { font-weight: 500; font-size: .92rem; }
.opt { color: var(--muted); font-weight: 400; }
input, select, textarea { font: inherit; font-size: 1rem; padding: 11px 12px; border: 1px solid #cfcfcf; border-radius: 8px; background: #fff; color: var(--ink); width: 100%; }
input:focus, select:focus, textarea:focus { border-color: var(--ink); outline: 2px solid var(--ink); outline-offset: 0; }
textarea { min-height: 90px; resize: vertical; }
.radio-row { display: flex; flex-wrap: wrap; gap: 10px; }
.radio-row label { display: flex; align-items: center; gap: 8px; border: 1px solid #cfcfcf; border-radius: 8px; padding: 10px 14px; cursor: pointer; font-weight: 500; }
.radio-row input { width: auto; accent-color: var(--red); }
.radio-row label:has(input:checked) { border-color: var(--red); background: var(--red-soft); }
.check { display: flex; gap: 10px; align-items: flex-start; font-weight: 400; }
.check input { width: 18px; height: 18px; margin-top: 4px; accent-color: var(--red); flex: none; }
.err { color: var(--red-dark); font-size: .85rem; min-height: 0; }
[aria-invalid="true"] { border-color: var(--red); background: var(--red-soft); }
.hint { font-size: .85rem; color: var(--muted); }
.notice { border-left: 4px solid var(--red); background: var(--red-soft); padding: 14px 18px; border-radius: 0 8px 8px 0; font-size: .95rem; }
.notice.neutral { border-color: var(--ink); background: var(--bg-alt); }
.leg { display: grid; gap: 12px; grid-template-columns: 1fr 1fr 1fr auto; align-items: end; margin-bottom: 12px; }
@media (max-width: 640px) { .leg { grid-template-columns: 1fr 1fr; } }
.hp { position: absolute; left: -5000px; }

.summary { white-space: pre-wrap; font-family: ui-monospace, "SF Mono", Menlo, monospace; font-size: .9rem; background: var(--bg-alt); border: 1px solid var(--line); border-radius: 8px; padding: 16px; margin: 0; overflow-x: auto; }
.success { text-align: center; padding: 40px 20px; }
.success .tick { width: 56px; height: 56px; border-radius: 50%; background: var(--red); color: #fff; display: grid; place-items: center; margin: 0 auto 16px; font-size: 1.6rem; }

/* FAQ */
.faq { max-width: 820px; }
.faq details { border-bottom: 1px solid var(--line); padding: 18px 0; }
.faq summary { cursor: pointer; font-weight: 600; list-style: none; display: flex; justify-content: space-between; gap: 16px; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary::after { content: "+"; color: var(--red); font-size: 1.4rem; line-height: 1; }
.faq details[open] summary::after { content: "−"; }
.faq .answer { margin-top: 12px; color: var(--muted); }
.badge { display: inline-block; font-size: .72rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase; padding: 3px 8px; border-radius: 4px; background: #fff4d6; color: #7a5200; border: 1px solid #f0d58a; vertical-align: middle; }
.badge.ok { background: #e8f6ec; color: #1d6b35; border-color: #b6e2c3; }
.badge.red { background: var(--red-soft); color: var(--red-dark); border-color: #f3c3c4; }

/* Contact */
.contact-grid { display: grid; gap: 24px; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); }
.contact-grid dt { font-weight: 700; margin-top: 14px; }
.contact-grid dd { margin: 4px 0 0; color: var(--muted); }
.placeholder { background: #fff4d6; color: #7a5200; padding: 1px 6px; border-radius: 4px; font-size: .9em; }

/* Footer */
.site-footer { border-top: 1px solid var(--line); padding: 36px 0; font-size: .9rem; color: var(--muted); }
.site-footer .container { display: flex; flex-wrap: wrap; gap: 16px 32px; justify-content: space-between; }
.site-footer a { color: var(--muted); }
.site-footer nav { display: flex; gap: 20px; flex-wrap: wrap; }

/* Legal pages */
.legal { max-width: 760px; padding: 56px 20px 80px; }
.legal h2 { font-size: 1.3rem; margin-top: 2em; }

/* Chat widget */
.chat-fab { position: fixed; right: 20px; bottom: 20px; z-index: 50; display: flex; align-items: center; gap: 10px; background: var(--red); color: #fff; border: 0; border-radius: 999px; padding: 14px 20px; font: inherit; font-weight: 600; cursor: pointer; box-shadow: 0 6px 20px rgba(0,0,0,.18); }
.chat-fab:hover { background: var(--red-dark); }
.chat-panel { position: fixed; right: 20px; bottom: 20px; z-index: 60; width: min(400px, calc(100vw - 24px)); height: min(640px, calc(100dvh - 40px)); background: #fff; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 16px 48px rgba(0,0,0,.2); display: flex; flex-direction: column; overflow: hidden; }
.chat-panel[hidden] { display: none; }
@media (max-width: 520px) { .chat-panel { right: 0; bottom: 0; width: 100vw; height: 100dvh; border-radius: 0; } }
.chat-head { display: flex; align-items: center; gap: 10px; padding: 14px 16px; border-bottom: 1px solid var(--line); }
.chat-head strong { display: block; }
.chat-head .muted { font-size: .8rem; }
.chat-head .spacer { flex: 1; }
.icon-btn { background: none; border: 0; font: inherit; font-size: 1.3rem; cursor: pointer; padding: 4px 8px; border-radius: 6px; color: var(--ink); }
.icon-btn:hover { background: var(--bg-alt); }
.chat-log { flex: 1; overflow-y: auto; padding: 16px; display: flex; flex-direction: column; gap: 10px; background: var(--bg-alt); }
.msg { max-width: 85%; padding: 10px 14px; border-radius: 14px; white-space: pre-wrap; word-wrap: break-word; font-size: .95rem; }
.msg.bot { background: #fff; border: 1px solid var(--line); align-self: flex-start; border-bottom-left-radius: 4px; }
.msg.user { background: var(--ink); color: #fff; align-self: flex-end; border-bottom-right-radius: 4px; }
.msg.sys { align-self: center; background: none; color: var(--muted); font-size: .8rem; text-align: center; }
.msg.typing { color: var(--muted); }
.chat-card { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 14px; align-self: stretch; display: grid; gap: 10px; }
.chat-card .summary { font-size: .8rem; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; padding: 8px 16px 0; }
.chip { border: 1px solid var(--line); background: #fff; border-radius: 999px; padding: 6px 12px; font: inherit; font-size: .85rem; cursor: pointer; }
.chip:hover { border-color: var(--red); color: var(--red); }
.chat-form { display: flex; gap: 8px; padding: 12px 16px 14px; border-top: 1px solid var(--line); }
.chat-form textarea { min-height: 44px; max-height: 120px; resize: none; padding: 10px 12px; }
.chat-foot { font-size: .72rem; color: var(--muted); padding: 0 16px 10px; }

/* Admin */
.admin-body { background: var(--bg-alt); }
.admin-wrap { max-width: 1280px; margin: 0 auto; padding: 24px 20px 60px; }
.admin-top { display: flex; align-items: center; gap: 16px; flex-wrap: wrap; margin-bottom: 20px; }
.tabs { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin-bottom: 20px; }
.tabs button { background: none; border: 0; border-bottom: 3px solid transparent; padding: 10px 16px; font: inherit; font-weight: 600; cursor: pointer; color: var(--muted); }
.tabs button[aria-selected="true"] { color: var(--ink); border-color: var(--red); }
.stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: 12px; margin-bottom: 20px; }
.stat { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; }
.stat b { display: block; font-size: 1.6rem; }
.toolbar { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: 16px; align-items: center; }
.toolbar input, .toolbar select { width: auto; min-width: 180px; }
.split { display: grid; grid-template-columns: minmax(300px, 420px) 1fr; gap: 20px; align-items: start; }
@media (max-width: 900px) { .split { grid-template-columns: 1fr; } }
.enq-list { list-style: none; margin: 0; padding: 0; background: #fff; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; max-height: 75vh; overflow-y: auto; }
.enq-list li button { display: block; width: 100%; text-align: left; background: none; border: 0; border-bottom: 1px solid var(--line); padding: 14px 16px; font: inherit; cursor: pointer; }
.enq-list li button:hover { background: var(--bg-alt); }
.enq-list li button[aria-current="true"] { background: var(--red-soft); box-shadow: inset 3px 0 0 var(--red); }
.enq-list .row1 { display: flex; justify-content: space-between; gap: 8px; font-weight: 600; }
.enq-list .row2 { color: var(--muted); font-size: .85rem; }
.status { font-size: .72rem; font-weight: 700; text-transform: uppercase; padding: 2px 8px; border-radius: 4px; white-space: nowrap; }
.status.new { background: var(--red); color: #fff; }
.status.in-progress { background: #fff4d6; color: #7a5200; }
.status.quoted { background: #e6effd; color: #1a4a96; }
.status.closed { background: #eee; color: #555; }
.panel { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 22px; }
.kv { display: grid; grid-template-columns: 170px 1fr; gap: 6px 16px; margin: 0 0 20px; }
.kv dt { color: var(--muted); }
.kv dd { margin: 0; }
@media (max-width: 520px) { .kv { grid-template-columns: 1fr; } .kv dd { margin-bottom: 8px; } }
.note { border-left: 3px solid var(--line); padding: 4px 12px; margin: 8px 0; font-size: .92rem; }
.faq-edit { display: grid; gap: 16px; }
.faq-item { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 18px; display: grid; gap: 12px; }
.faq-item .fields { grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); }
.login { max-width: 380px; margin: 12vh auto; }
.empty { padding: 40px; text-align: center; color: var(--muted); }
.mt { margin-top: 16px; }
.consent-row { margin: 18px 0; }
.label { font-weight: 500; font-size: .92rem; }
.grow { flex: 1; }
.h-sm { font-size: 1.25rem; margin: 0; }
.admin-top .badge { margin-left: 4px; }

/* ---------- Polish (brand match) ---------- */
.hero h1 .accent { color: var(--brand); }
.eyebrow { color: var(--red); }
.header-cta { margin-left: 4px; }
@media (max-width: 820px) { .header-cta { display: none; } }

.hero { position: relative; overflow: hidden; background:
  radial-gradient(900px 420px at 100% 0%, var(--red-soft), transparent 70%), var(--bg); }
.hero-grid { display: grid; grid-template-columns: 1.25fr 1fr; gap: 56px; align-items: center; }
@media (max-width: 900px) { .hero-grid { grid-template-columns: 1fr; gap: 40px; } }

.route-card { background: #fff; border: 1px solid var(--line); border-radius: 16px; padding: 24px 24px 20px; box-shadow: 0 18px 50px -24px rgba(20,20,20,.25); }
.route-title { font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin: 0 0 6px; }
html[lang="bn"] .route-title { letter-spacing: 0; font-size: .9rem; }
.route-arc { width: 100%; height: auto; display: block; }
.route-arc > path { fill: none; stroke: var(--ink); stroke-width: 2; stroke-dasharray: 6 6; stroke-linecap: round; }
.route-arc g path { fill: var(--ink); }
.route-arc circle { fill: var(--ink); }
.route-arc circle.dest { fill: var(--brand); }
.route-ends { display: flex; justify-content: space-between; font-size: .9rem; margin: -4px 0 14px; color: var(--muted); }
.route-ends b { color: var(--ink); font-family: "Poppins", "Inter", sans-serif; font-style: italic; }
.route-ends .to { color: var(--red); font-weight: 600; }
.route-list { list-style: none; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.route-list li { font-size: .88rem; padding: 6px 12px; border-radius: 999px; background: var(--bg-alt); border: 1px solid var(--line); }

.trust { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: #fff; }
.trust-row { display: flex; flex-wrap: wrap; gap: 14px 40px; padding-top: 18px; padding-bottom: 18px; justify-content: space-between; }
.trust-row > span { display: inline-flex; align-items: center; gap: 10px; font-weight: 600; font-size: .95rem; }
.trust-row svg { width: 20px; height: 20px; fill: var(--brand); flex: none; }

section h2 { position: relative; }
.section-head h2::after { content: ""; display: block; width: 44px; height: 4px; border-radius: 2px; background: var(--brand); margin-top: 14px; }

.card { transition: border-color .15s, box-shadow .15s; }
.card:hover { border-color: #d6d6d6; box-shadow: 0 10px 30px -18px rgba(20,20,20,.3); }
.card .icon { background: var(--red-soft); color: var(--brand); }
.steps li::before { background: var(--brand); }
.airline-list li { background: #fff; }

.contact-cards { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
.c-card { border: 1px solid var(--line); border-radius: 12px; padding: 20px; background: #fff; }
.c-card p { margin: 0 0 6px; }
.c-wide { grid-column: span 2; }
@media (max-width: 560px) { .c-wide { grid-column: auto; } }
.c-label { font-size: .8rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
html[lang="bn"] .c-label { letter-spacing: 0; font-size: .9rem; }
.c-value { font-size: 1.2rem; font-weight: 700; }
.c-value a, .c-value-sm a { color: var(--ink); text-decoration: none; }
.c-value a:hover { color: var(--red); }
.c-value-sm { font-weight: 500; }

.site-footer { background: var(--ink); color: #bdbdbd; border-top: 0; }
.site-footer a { color: #e6e6e6; }
.site-footer .logo, .site-footer .logo:hover { color: #fff; }
.site-footer .logo .lplane { fill: #fff; }
.site-footer .logo .ltrail { stroke: #fff; }
.chat-fab { background: var(--red); }
@media (max-width: 520px) { .chat-fab { padding: 16px; right: 16px; bottom: 16px; } .chat-fab span { display: none; } }

/* ---------- Sign theme (cream / red / charcoal) ---------- */
.btn-primary, .chat-fab { background: var(--accent); color: var(--on-accent); }
.btn-primary:hover, .chat-fab:hover { background: var(--accent-hover); color: var(--on-accent); }
.hero h1 .accent { color: var(--headline-accent); }
.steps li::before { color: #fff; }
.success .tick { background: var(--accent); color: #fff; }
.status.new { background: var(--accent); color: #fff; }
.radio-row input, .check input { accent-color: var(--accent); }
.radio-row label:has(input:checked) { border-color: var(--brand); }
.err { color: var(--danger); }
[aria-invalid="true"] { border-color: var(--danger); background: var(--danger-soft); }
.badge.red { background: var(--danger-soft); color: var(--danger); border-color: #f3c3c0; }
.notice { border-left-color: var(--brand); }
:focus-visible { outline-color: var(--brand); }

/* Dark header and footer, like the wall behind the sign */
.site-header { background: rgba(35,31,28,.97); border-bottom-color: #3a342f; }
.site-header .logo .lt, .site-footer .logo .lt { color: var(--cream); }
.site-header .logo .lplane, .site-footer .logo .lplane { fill: var(--cream); }
.site-header .logo .ltrail, .site-footer .logo .ltrail { stroke: var(--cream); }
.site-header .nav a { color: #e9e2d8; }
.site-header .nav a:hover { color: var(--cream); text-decoration: underline; text-underline-offset: 6px; text-decoration-color: var(--brand); }
.site-header .lang-toggle { background: transparent; color: var(--cream); border-color: #5a524b; }
.site-header .lang-toggle:hover { border-color: var(--cream); }
.site-header .menu-btn { color: var(--cream); }
@media (max-width: 820px) {
  .site-header .nav { background: var(--char); border-bottom-color: #3a342f; }
  .site-header .nav a { border-top-color: #3a342f; }
}
.site-footer { background: var(--char); }
.site-footer .logo .lp { color: var(--brand); }

/* Warm cream tints instead of grey */
:root { --bg-alt: #faf5ee; }
.hero { background: radial-gradient(900px 420px at 100% 0%, #f7e9d4, transparent 70%), var(--bg); }
.route-list li { background: #fbf6ef; border-color: #eee3d4; }
.trust { background: #fffdf9; }
.steps li::before { display: grid; margin-bottom: 12px; }
.steps li { color: var(--ink); }

/* Warm text colours */
h1, h2, h3 { color: var(--char); }
.card ul, .faq .answer { color: var(--muted); }
input, select, textarea { border-color: #d8cdbf; color: var(--ink); }
input::placeholder, textarea::placeholder { color: #9a8f85; }
.opt, .hint { color: var(--muted); }
.site-footer { color: #cfc5b8; }
.site-footer a { color: var(--cream); }
.msg.user { background: var(--char); }

/* White page, header colours for text */
:root { --bg: #ffffff; --bg-alt: #ffffff; }
section.alt { background: #fff; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.hero { background: #fff; }
.trust { background: #fff; }

/* =========================================================
   Logo palette: cream + orange (no red).
   Cream is used as text on dark bands; on white, text uses a
   deep warm brown from the same family so it stays readable.
   ========================================================= */
:root {
  --brand: #f37021;          /* logo "Pro" orange — marks, underlines, icons */
  --accent: #f37021;         /* button fill, paired with dark text (6:1) */
  --accent-hover: #e2600f;
  --on-accent: #231f1c;
  --red: #c2500c;            /* small orange text / links on white (4.6:1) */
  --red-dark: #9c3f08;
  --red-soft: #fff1e6;
  --headline-accent: #e0620f;/* large headline orange (3.4:1, large-text AA) */
  --ink: #3b2f24;            /* deep cream-brown body text */
  --muted: #7a6653;          /* warm tan secondary text (5.3:1) */
  --cream: #f6e6cb;
}
h1, h2, h3 { color: #2b221a; }
.btn-primary, .chat-fab, .success .tick, .status.new { background: var(--accent); color: var(--on-accent); }
.btn-primary:hover, .chat-fab:hover { background: var(--accent-hover); color: var(--on-accent); }
.steps li::before { background: var(--accent); color: var(--on-accent); }
.msg.user { background: var(--char); color: var(--cream); }

/* Cream text on dark bands */
.site-header .nav a, .site-header .lang-toggle { color: var(--cream); }
.site-header .nav a:hover { color: var(--brand); }
.site-footer, .site-footer p { color: var(--cream); }
.site-footer a { color: var(--brand); }
.trust { background: var(--char); border-color: var(--char); }
.trust-row > span { color: var(--cream); }
.trust-row svg { fill: var(--brand); }

/* Airline logo strip */
.airline-logos { list-style: none; padding: 0; margin: 16px 0 12px; display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); }
.airline-logos li { height: 72px; display: grid; place-items: center; padding: 12px 16px; background: #fff; border: 1px solid var(--line); border-radius: 12px; }
.airline-logos img { max-width: 100%; max-height: 40px; object-fit: contain; }
.airline-logos .text-logo { font-weight: 800; font-size: .95rem; color: var(--ink); text-align: center; letter-spacing: -.01em; }
.airline-logos { grid-template-columns: repeat(4, 1fr); }
@media (min-width: 900px) { .airline-logos { grid-template-columns: repeat(8, 1fr); } }
@media (max-width: 420px) { .airline-logos { grid-template-columns: repeat(2, 1fr); } }
.airline-logos li { padding: 10px 12px; }

/* Destination photography */
.destination-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; margin-bottom:20px; }
.destination-card { position:relative; display:block; border-radius:14px; overflow:hidden; color:white; background:#302a25; aspect-ratio:4/5; text-decoration:none; }
.destination-card img { display:block; width:100%; height:100%; object-fit:cover; transition:transform .25s ease; }
.destination-card::after { content:''; position:absolute; inset:35% 0 0; background:linear-gradient(transparent,rgba(0,0,0,.8)); }
.destination-caption { position:absolute; bottom:24px; left:24px; right:24px; z-index:1; display:flex; justify-content:space-between; align-items:end; }
.destination-caption small { display:block; color:#fff; font-size:.8rem; margin-bottom:6px; }
.destination-caption strong { display:block; font-size:1.6rem; line-height:1.2; }
.destination-card:hover img { transform:scale(1.035); }
.destination-card:focus-visible { outline:3px solid var(--accent); outline-offset:4px; }
@media(max-width:650px){ .destination-grid{grid-template-columns:1fr;gap:16px;} .destination-card{aspect-ratio:4/3;} }
@media(prefers-reduced-motion:reduce){.destination-card img{transition:none;}}

.destination-grid { display:flex; gap:24px; overflow-x:auto; scroll-snap-type:x mandatory; scrollbar-width:none; padding:4px; scroll-padding-inline:4px; }
.destination-grid::-webkit-scrollbar { display:none; }
.destination-grid .destination-card { flex:0 0 calc((100% - 48px)/3); scroll-snap-align:start; }
.destination-controls { display:flex; justify-content:space-between; align-items:center; gap:16px; margin-bottom:16px; color:var(--muted); font-size:.9rem; }
.destination-controls>div { display:flex;gap:8px; }
.destination-controls button { min-width:46px;min-height:46px; }
.destination-controls button:disabled { opacity:.4;cursor:default; }
@media(max-width:900px){.destination-grid .destination-card{flex-basis:calc((100% - 24px)/2);}}
@media(max-width:650px){.destination-grid{gap:16px;}.destination-grid .destination-card{flex-basis:86%;aspect-ratio:4/5;}}

/* Actionable business information strip. */
.trust-action { display:inline-flex; align-items:center; gap:10px; color:var(--cream); font:inherit; font-weight:600; font-size:.95rem; text-align:left; background:none; border:0; padding:8px 0; cursor:pointer; text-decoration:none; }
.trust-action:hover { color:white; text-decoration:underline; text-underline-offset:4px; }
.trust-action:focus-visible { outline:2px solid var(--brand); outline-offset:5px; border-radius:3px; }

.airline-logos li { height:auto; padding:0; }
.airline-logos a { display:flex; flex-direction:column; justify-content:center; align-items:center; gap:8px; width:100%; min-height:94px; padding:12px 8px; border-radius:12px; color:var(--muted); text-decoration:none; }
.airline-logos a img { height:36px; width:100%; object-fit:contain; }
.airline-link-hint { font-size:.65rem; text-align:center; }
.airline-logos a:hover { background:#fff5ec; color:var(--brand); }
.airline-logos a:focus-visible { outline:3px solid var(--brand); outline-offset:3px; }

.route-list li { padding:0; }
.route-list a { display:block; padding:6px 12px; border-radius:999px; color:inherit; text-decoration:none; }
.route-list a:hover { background:var(--brand); color:#fff; }
.route-list a:focus-visible { outline:3px solid var(--brand); outline-offset:3px; }
.route-plane { offset-path:path('M14 76 C90 8 230 8 306 60'); offset-rotate:auto; animation:route-flight 5s ease-in-out infinite; }
@keyframes route-flight { 0% { offset-distance:0%; opacity:0; } 10%,85% { opacity:1; } 100% { offset-distance:100%; opacity:0; } }
@media(prefers-reduced-motion:reduce) { .route-plane { animation:none; offset-distance:50%; } }

.whatsapp-takeoff { position:fixed; inset:0; z-index:10000; display:flex; flex-direction:column; align-items:center; justify-content:center; overflow:hidden; background:rgba(255,253,249,.97); color:var(--ink); }
.whatsapp-takeoff p { margin-top:36px; padding:0 24px; text-align:center; font-weight:600; }
.takeoff-plane { font-size:64px; color:var(--brand); animation:whatsapp-takeoff 1.2s ease-in forwards; }
@keyframes whatsapp-takeoff { 0% { transform:translate(-120px,70px) rotate(-12deg); opacity:0; } 15% { opacity:1; } 50% { transform:translate(0,0) rotate(-22deg); opacity:1; } 100% { transform:translate(45vw,-45vh) rotate(-28deg); opacity:0; } }
@media(prefers-reduced-motion:reduce) { .takeoff-plane { animation:none; } }

/* =========================================================
   Mobile-friendly layer (desktop unchanged)
   ========================================================= */
.mobile-bar { display: none; }
input, select, textarea { font-size: 16px; }            /* stops iOS zooming into fields */
.airline-logos a, .airline-logos small { font-size: .78rem; }

@media (max-width: 720px) {
  /* Comfortable tap targets in the header */
  .site-header .container { height: 60px; gap: 10px; }
  .menu-btn { min-width: 44px; min-height: 44px; font-size: 1.4rem; }
  .site-header .lang-toggle { min-height: 40px; padding: 8px 14px; }
  .nav { top: 60px; box-shadow: 0 12px 24px -12px rgba(0,0,0,.5); }
  .nav a { padding: 16px 20px; font-size: 1rem; }

  /* Tighter vertical rhythm */
  section { padding: 52px 0; }
  .hero { padding: 36px 0 44px; }
  .section-head { margin-bottom: 28px; }
  .container { padding-left: 16px; padding-right: 16px; }

  /* Full-width, thumb-friendly buttons */
  .hero .actions, #contact .actions, #review .actions { flex-direction: column; }
  .hero .actions .btn, #contact .actions .btn, #review .actions .btn { width: 100%; min-height: 50px; }
  .btn { min-height: 46px; }

  /* Enquiry form */
  fieldset { padding: 16px 14px; }
  .fields { grid-template-columns: 1fr 1fr; gap: 14px 12px; }
  .fields .field:has(input[type=date]), .fields .field:has(#from), .fields .field:has(#to),
  .fields .field:has(textarea), .fields .field:has(#name), .fields .field:has(#phone), .fields .field:has(#email),
  .fields .field:has(#baggage), .fields .field:has(#airlines), .fields .field:has(#childAges) { grid-column: 1 / -1; }
  .radio-row { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
  .radio-row label { justify-content: center; padding: 12px 6px; min-height: 48px; font-size: .92rem; text-align: center; }
  .radio-row input { position: absolute; opacity: 0; pointer-events: none; }   /* whole chip is the control */
  .radio-row label:has(input:focus-visible) { outline: 3px solid var(--brand); outline-offset: 2px; }
  input, select, textarea { min-height: 48px; }
  .leg { grid-template-columns: 1fr 1fr; }
  .leg .field:has(.leg-date), .leg .leg-rm { grid-column: 1 / -1; }
  #form-error { position: sticky; bottom: 76px; }
  #enquiry-form > .actions .btn { width: 100%; min-height: 52px; }

  /* Cards and lists */
  .card { padding: 20px; }
  .c-wide { grid-column: auto; }
  .steps { grid-template-columns: 1fr 1fr; gap: 20px 16px; }
  .faq summary { padding: 4px 0; min-height: 44px; align-items: center; }
  .trust-row { flex-direction: column; gap: 12px; }

  /* Quick-action bar replaces the floating chat button */
  .chat-fab { display: none; }
  body { padding-bottom: calc(68px + env(safe-area-inset-bottom)); }
  .mobile-bar {
    display: grid; grid-template-columns: repeat(4, 1fr);
    position: fixed; left: 0; right: 0; bottom: 0; z-index: 55;
    background: var(--char); border-top: 1px solid #3a342f;
    padding: 6px 6px calc(6px + env(safe-area-inset-bottom));
  }
  .mobile-bar a, .mobile-bar button {
    display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 3px;
    min-height: 54px; border: 0; background: none; font: inherit; font-size: .75rem; font-weight: 600;
    color: var(--cream); text-decoration: none; border-radius: 10px; cursor: pointer;
  }
  .mobile-bar a:active, .mobile-bar button:active { background: rgba(255,255,255,.08); }
  .mobile-bar svg { width: 22px; height: 22px; fill: var(--cream); }
  .mobile-bar a:first-child { background: var(--accent); color: var(--on-accent); }
  .mobile-bar a:first-child svg { fill: var(--on-accent); }

  /* Chat panel: full screen, clear of the notch and home bar */
  .chat-panel { padding-bottom: env(safe-area-inset-bottom); padding-top: env(safe-area-inset-top); }
  .chat-form textarea { font-size: 16px; }
  .chip { min-height: 40px; padding: 8px 14px; }
}

@media (max-width: 360px) {
  .steps { grid-template-columns: 1fr; }
  .radio-row label { font-size: .85rem; }
}

/* Tablet: two-column grids read better than one */
@media (min-width: 721px) and (max-width: 1024px) {
  .hero-grid { gap: 32px; }
  .contact-cards { grid-template-columns: 1fr 1fr; }
  .c-wide { grid-column: 1 / -1; }
}

/* The hidden attribute must always win over component display rules (e.g. .field { display:flex }). */
[hidden] { display: none !important; }
#simple-route, #multi-route { margin-top: 16px; }
@media (max-width: 720px) {
  .fields.mt .field { grid-column: 1 / -1; }
}

/* ---------- Notice board ---------- */
.notices { background: var(--red-soft); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.notice-list { display: grid; gap: 16px; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.notice-card { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 20px; display: flex; flex-direction: column; gap: 10px; }
.notice-card.offer { border-top: 4px solid var(--brand); }
.notice-card.notice { border-top: 4px solid var(--char); }
.notice-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; font-size: .8rem; color: var(--muted); }
.notice-tag { font-weight: 700; text-transform: uppercase; letter-spacing: .06em; padding: 3px 9px; border-radius: 999px; font-size: .72rem; }
html[lang="bn"] .notice-tag { letter-spacing: 0; font-size: .8rem; }
.notice-tag.offer { background: var(--accent); color: var(--on-accent); }
.notice-tag.notice { background: var(--char); color: var(--cream); }
.notice-until { font-weight: 600; color: var(--red); }
.notice-title { margin: 0; font-size: 1.15rem; }
.notice-body { margin: 0; white-space: pre-line; color: var(--ink); }
.notice-body.clamped { display: -webkit-box; -webkit-line-clamp: 4; -webkit-box-orient: vertical; overflow: hidden; }
.notice-more { align-self: flex-start; background: none; border: 0; padding: 4px 0; font: inherit; font-weight: 600; color: var(--red); cursor: pointer; }
.notice-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-top: auto; padding-top: 6px; }
.notice-disclaimer { margin-top: 16px; }
@media (max-width: 720px) {
  .notice-list { grid-template-columns: 1fr; display: flex; overflow-x: auto; scroll-snap-type: x mandatory; gap: 12px; margin: 0 -16px; padding: 0 16px 6px; }
  .notice-list > .notice-card { flex: 0 0 86%; scroll-snap-align: start; }
  .notice-list:has(> :only-child) > .notice-card { flex-basis: 100%; }
  .notice-actions .btn { flex: 1; min-height: 46px; }
}
.notice-admin-list { list-style: none; padding: 0; margin: 0; display: grid; gap: 10px; }
.notice-admin-item { background: #fff; border: 1px solid var(--line); border-radius: 10px; padding: 14px 16px; display: grid; gap: 6px; }
.notice-admin-item .row1 { display: flex; justify-content: space-between; gap: 10px; align-items: flex-start; }
#notice-form .fields { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }

/* ---------- Hero globe ---------- */
.globe-wrap { width: 100%; max-width: 300px; margin: 4px auto 6px; aspect-ratio: 1; }
.route-globe { width: 100%; height: 100%; display: block; overflow: visible; }
.route-globe .g-stop-1 { stop-color: #fffaf2; }
.route-globe .g-stop-2 { stop-color: #f3e2c6; }
.route-globe .g-sphere { stroke: #e3d2b6; stroke-width: 1.5; }
.route-globe .g-grid { fill: none; stroke: rgba(35, 31, 28, .13); stroke-width: .8; }
.route-globe .g-route { fill: none; stroke: rgba(35, 31, 28, .35); stroke-width: 1.6; stroke-dasharray: 4 5; stroke-linecap: round; }
.route-globe .g-route-done { fill: none; stroke: var(--brand); stroke-width: 2.4; stroke-linecap: round; }
.route-globe .g-home { fill: var(--char); stroke: #fff; stroke-width: 2; }
.route-globe .g-dest { fill: var(--brand); stroke: #fff; stroke-width: 2; }
.route-globe .g-label { font: 700 11px "Poppins", "Inter", sans-serif; font-style: italic; fill: var(--char); paint-order: stroke; stroke: #fffaf2; stroke-width: 3px; }
.route-globe .g-plane path { fill: var(--char); stroke: #fffaf2; stroke-width: 1.2px; paint-order: stroke; }
.route-ends .to { min-height: 1.4em; }
@media (max-width: 720px) { .globe-wrap { max-width: 250px; } }
.route-globe .g-space { fill: #fbf4e9; }
.route-globe .g-ring { fill: none; stroke: #e3d2b6; stroke-width: 1.5; }

/* ---------- Earth globe ---------- */
.route-globe .g-glow { fill: none; stroke: rgba(40, 110, 170, .18); stroke-width: 8; }
.route-globe .g-ocean-1 { stop-color: #7cc0e8; }
.route-globe .g-ocean-2 { stop-color: #1f5f93; }
.route-globe .g-grid { fill: none; stroke: rgba(255, 255, 255, .16); stroke-width: .6; }
.route-globe .g-land { fill: #d9c9a3; stroke: #b7a57c; stroke-width: .5; fill-rule: nonzero; }
.route-globe .g-border { fill: none; stroke: rgba(120, 100, 70, .45); stroke-width: .4; }
.route-globe .g-shade-0 { stop-color: rgba(0, 0, 0, 0); }
.route-globe .g-shade-1 { stop-color: rgba(0, 20, 40, .35); }
.route-globe .g-shading { pointer-events: none; }
.route-globe .g-track { fill: none; stroke: rgba(255, 255, 255, .55); stroke-width: .8; stroke-dasharray: 2 3; }
.route-globe .g-trail { fill: none; stroke-width: 1.8; stroke-linecap: round; opacity: .95; }
.route-globe .g-ap circle { fill: #fff; stroke: var(--char); stroke-width: 1; }
.route-globe .g-ap.hub circle { fill: var(--brand); stroke: #fff; stroke-width: 1.2; }
.route-globe .g-code { font: 700 7px "Inter", sans-serif; fill: #fff; paint-order: stroke; stroke: rgba(20, 30, 45, .85); stroke-width: 2.2px; opacity: 0; transition: opacity .3s; }
.route-globe .g-ap.labelled .g-code { opacity: 1; }
.route-globe .g-ap.hub .g-code { font-size: 8px; }
.route-globe .behind { opacity: 0; }
.route-globe .g-plane path { stroke: #fff; stroke-width: 1.6px; paint-order: stroke; }
.globe-legend-view { width: 272px; max-width: 100%; margin: 6px auto 4px; padding: 3px 0; overflow: hidden; }   /* width set in JS to fit 3 badges */
.globe-legend { list-style: none; padding: 0; margin: 0; display: flex; gap: 8px; width: max-content; transition: transform .6s ease; }
.globe-legend.no-anim { transition: none; }
.globe-legend li { flex: none; }
.globe-legend li { display: inline-flex; align-items: center; gap: 5px; }
.globe-legend li { box-sizing: border-box; width: 84px; height: 32px; padding: 5px 12px; border-radius: 999px; background: #fff; border: 2px solid transparent; box-shadow: 0 1px 3px rgba(0,0,0,.12); overflow: hidden; }
@media (max-width: 380px) { .globe-legend li { width: 74px; height: 30px; padding: 5px 9px; } }
.globe-legend img { display: block; width: 100%; height: 100%; object-fit: contain; }
.globe-legend li.square { padding-top: 1px; padding-bottom: 1px; }
.globe-legend li.square img { transform: scale(1.35); }
.globe-note { text-align: center; font-size: .72rem; color: var(--muted); margin: 2px 0 14px; }
.route-title-sub { margin-top: 4px; }
.route-list .route-extra { display: none; }
.route-list.show-all .route-extra { display: list-item; }
.route-more { margin-top: 10px; background: none; border: 0; padding: 6px 0; font: inherit; font-weight: 600; font-size: .88rem; color: var(--red); cursor: pointer; }
.route-globe .g-network { fill: none; stroke: rgba(255, 255, 255, .28); stroke-width: .45; }
.route-globe .g-night { fill: rgba(3, 10, 30, .62); }
.globe-live { text-align: center; font-size: .74rem; font-weight: 600; color: var(--ink); margin: 0 0 4px; }
.globe-clocks { margin: 4px 0 6px; overflow: hidden; font-size: .72rem; width: 100%; contain: inline-size; /* the long track must not widen the card */
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent); }
.globe-clocks .ck-track { display: flex; width: max-content; animation: ck-slide 45s linear infinite; }
.globe-clocks:hover .ck-track, .globe-clocks:focus-within .ck-track { animation-play-state: paused; }
.globe-clocks ul { list-style: none; margin: 0; padding: 0 6px 0 0; display: flex; gap: 6px; }
.globe-clocks li { display: flex; align-items: center; gap: 4px; padding: 3px 9px; border-radius: 999px; background: #fdf6ec; color: var(--ink); white-space: nowrap; }
.globe-clocks li.night { background: #1f2a44; color: #e8ecf5; }
.globe-clocks .ck-icon { color: #f39c12; font-size: .8rem; line-height: 1; }
.globe-clocks li.night .ck-icon { color: #cfd8ff; }
.globe-clocks time { font-weight: 700; font-variant-numeric: tabular-nums; }
@keyframes ck-slide { to { transform: translateX(-50%); } }
@media (prefers-reduced-motion: reduce) {
  .globe-clocks { overflow-x: auto; }
  .globe-clocks .ck-track { animation: none; }
  .globe-clocks ul[aria-hidden] { display: none; }
}

/* ---------- Side arrows for sliders ---------- */
.slider { position: relative; }
.slider-arrow {
  position: absolute; top: 50%; transform: translateY(-50%); z-index: 3;
  width: 48px; height: 48px; border-radius: 50%; border: 1px solid var(--line);
  background: #fff; color: var(--char); font: 700 1.25rem/1 "Inter", sans-serif; cursor: pointer;
  display: grid; place-items: center; box-shadow: 0 8px 22px -10px rgba(0, 0, 0, .45);
  transition: background .15s, color .15s, opacity .15s;
}
.slider-arrow:hover:not(:disabled) { background: var(--accent); color: var(--on-accent); border-color: var(--accent); }
.slider-arrow:disabled { opacity: 0; pointer-events: none; }
.slider-arrow.prev { left: -24px; }
.slider-arrow.next { right: -24px; }
.destination-controls { justify-content: center; margin-top: 4px; }
@media (max-width: 1180px) { .slider-arrow.prev { left: 6px; } .slider-arrow.next { right: 6px; } }
@media (max-width: 720px) { .slider-arrow { width: 42px; height: 42px; } }

/* Offers carousel */
.notice-list { display: flex !important; overflow-x: auto; scroll-snap-type: x mandatory; scrollbar-width: none; gap: 16px; padding: 4px; margin: 0; }
.notice-list::-webkit-scrollbar { display: none; }
.notice-list > .notice-card { flex: 0 0 calc((100% - 32px) / 3); scroll-snap-align: start; }
@media (max-width: 1000px) { .notice-list > .notice-card { flex-basis: calc((100% - 16px) / 2); } }
@media (max-width: 720px) { .notice-list { margin: 0; padding: 4px; } .notice-list > .notice-card { flex-basis: 88%; } }
.notice-list:focus-visible { outline: 3px solid var(--brand); outline-offset: 4px; border-radius: 14px; }
.notice-dots { display: flex; justify-content: center; gap: 8px; margin-top: 14px; }
.notice-dot { width: 10px; height: 10px; padding: 0; border-radius: 999px; border: 0; background: #d8c9b5; cursor: pointer; transition: width .2s, background .2s; }
.notice-dot[aria-selected="true"] { width: 26px; background: var(--brand); }
.notice-dot:focus-visible { outline: 2px solid var(--char); outline-offset: 3px; }
.notice-card { min-height: 100%; }

/* Calmer globe */
.route-globe .g-network { stroke: rgba(255, 255, 255, .13); stroke-width: .4; }
.route-globe .g-track { stroke: rgba(255, 255, 255, .35); }
.route-globe .g-ap:not(.hub) circle { r: 1.5; fill: rgba(255, 255, 255, .75); stroke: none; }
.route-globe .g-trail { stroke-width: 1.4; opacity: .8; }
@media (min-width: 721px) and (max-width: 1180px) {
  .slider { padding: 0 30px; }
  .slider-arrow.prev { left: -6px; } .slider-arrow.next { right: -6px; }
}

/* ---------- Payment ---------- */
.pay-grid { display: grid; gap: 16px; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); }
.pay-card { border: 1px solid var(--line); border-radius: 14px; padding: 20px; background: #fff; display: flex; flex-direction: column; gap: 8px; }
.pay-card h3 { margin: 4px 0 0; font-size: 1.05rem; }
.pay-card p { margin: 0; }
.pay-card .btn { align-self: flex-start; margin-top: auto; }
.pay-icon { width: 42px; height: 42px; border-radius: 10px; background: var(--red-soft); display: grid; place-items: center; }
.pay-icon svg { width: 22px; height: 22px; fill: var(--brand); }
.pay-tags { list-style: none; padding: 0; margin: 2px 0 0; display: flex; flex-wrap: wrap; gap: 6px; }
.pay-tags li { padding: 5px 12px; border-radius: 999px; background: var(--bg-alt); border: 1px solid var(--line); font-weight: 600; font-size: .9rem; }
.pay-accounts { display: grid; grid-template-columns: auto 1fr; gap: 4px 12px; margin: 0; font-size: .92rem; }
.pay-accounts dt { color: var(--muted); }
.pay-accounts dd { margin: 0; font-weight: 600; }
.pay-safety { display: flex; gap: 14px; margin-top: 20px; padding: 18px 20px; border-radius: 14px; background: var(--char); color: var(--cream); }
.pay-safety svg { width: 28px; height: 28px; fill: var(--brand); flex: none; margin-top: 2px; }
.pay-safety strong { display: block; margin-bottom: 6px; }
.pay-safety ul { margin: 0; padding-left: 1.1em; display: grid; gap: 4px; font-size: .93rem; }
@media (max-width: 720px) { .pay-grid { grid-template-columns: 1fr 1fr; gap: 12px; } .pay-card { padding: 16px; } }
@media (max-width: 420px) { .pay-grid { grid-template-columns: 1fr; } }


/* ---------- Loading: jet-engine spinner ---------- */
/* Front view of a jet engine: casing, 12 fan blades and the swirl on the spinner cone. The whole
   fan spins; the swirl is what makes it read as an engine rather than a generic spinner. */
.jet-spinner {
  display: inline-block; width: 22px; height: 22px; flex: none; vertical-align: middle;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='none' stroke='%23231f1c' stroke-width='1.9'/%3E%3Ccircle cx='12' cy='12' r='9.7' fill='none' stroke='%23231f1c' stroke-width='.5' opacity='.45'/%3E%3Cg fill='%233b322b'%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%280 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2820 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2840 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2860 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2880 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28100 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28120 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28140 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28160 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28180 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28200 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28220 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28240 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28260 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28280 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28300 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28320 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28340 12 12%29'/%3E%3C/g%3E%3Ccircle cx='12' cy='12' r='2.9' fill='%23ffffff' stroke='%23231f1c' stroke-width='.9'/%3E%3Cpath d='M12 9.3a2.7 2.7 0 0 1 2.7 2.7a1.7 1.7 0 0 1-1.7 1.7a1 1 0 0 1-1-1' fill='none' stroke='%23f37021' stroke-width='1.1' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
  animation: tp-jet-spin .55s linear infinite;
}
.jet-spinner.light { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='none' stroke='%23f6e6cb' stroke-width='1.9'/%3E%3Ccircle cx='12' cy='12' r='9.7' fill='none' stroke='%23f6e6cb' stroke-width='.5' opacity='.45'/%3E%3Cg fill='%23f6e6cb'%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%280 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2820 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2840 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2860 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2880 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28100 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28120 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28140 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28160 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28180 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28200 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28220 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28240 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28260 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28280 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28300 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28320 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28340 12 12%29'/%3E%3C/g%3E%3Ccircle cx='12' cy='12' r='2.9' fill='%23231f1c' stroke='%23f6e6cb' stroke-width='.9'/%3E%3Cpath d='M12 9.3a2.7 2.7 0 0 1 2.7 2.7a1.7 1.7 0 0 1-1.7 1.7a1 1 0 0 1-1-1' fill='none' stroke='%23f37021' stroke-width='1.1' stroke-linecap='round'/%3E%3C/svg%3E"); }
@keyframes tp-jet-spin { to { transform: rotate(360deg); } }
/* Spools up: starts slow, then settles into a fast spin. */
.jet-spinner.spool { animation: tp-jet-spool 1.2s cubic-bezier(.5, 0, .75, .5) 1, tp-jet-spin .55s linear 1.2s infinite; }
@keyframes tp-jet-spool { from { transform: rotate(0); } to { transform: rotate(540deg); } }

.msg.typing { display: inline-flex; align-items: center; gap: 10px; }

/* Buttons while working */
.btn[aria-busy="true"] { position: relative; cursor: progress; opacity: 1; }
.btn[aria-busy="true"]::before {
  content: ""; width: 20px; height: 20px; flex: none;
  background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='none' stroke='%23231f1c' stroke-width='1.9'/%3E%3Ccircle cx='12' cy='12' r='9.7' fill='none' stroke='%23231f1c' stroke-width='.5' opacity='.45'/%3E%3Cg fill='%233b322b'%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%280 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2820 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2840 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2860 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2880 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28100 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28120 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28140 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28160 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28180 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28200 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28220 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28240 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28260 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28280 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28300 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28320 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28340 12 12%29'/%3E%3C/g%3E%3Ccircle cx='12' cy='12' r='2.9' fill='%23ffffff' stroke='%23231f1c' stroke-width='.9'/%3E%3Cpath d='M12 9.3a2.7 2.7 0 0 1 2.7 2.7a1.7 1.7 0 0 1-1.7 1.7a1 1 0 0 1-1-1' fill='none' stroke='%23f37021' stroke-width='1.1' stroke-linecap='round'/%3E%3C/svg%3E") center / contain no-repeat;
  animation: tp-jet-spin .55s linear infinite;
}
.site-footer .btn[aria-busy="true"]::before, .btn-dark[aria-busy="true"]::before { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='11' fill='none' stroke='%23f6e6cb' stroke-width='1.9'/%3E%3Ccircle cx='12' cy='12' r='9.7' fill='none' stroke='%23f6e6cb' stroke-width='.5' opacity='.45'/%3E%3Cg fill='%23f6e6cb'%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%280 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2820 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2840 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2860 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%2880 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28100 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28120 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28140 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28160 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28180 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28200 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28220 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28240 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28260 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28280 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28300 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28320 12 12%29'/%3E%3Cpath d='M11.35 9.4C11.2 7.2 11.9 4.6 13.1 1.7L14.35 2.05C13.35 4.7 12.8 7.3 12.75 9.4Z' transform='rotate%28340 12 12%29'/%3E%3C/g%3E%3Ccircle cx='12' cy='12' r='2.9' fill='%23231f1c' stroke='%23f6e6cb' stroke-width='.9'/%3E%3Cpath d='M12 9.3a2.7 2.7 0 0 1 2.7 2.7a1.7 1.7 0 0 1-1.7 1.7a1 1 0 0 1-1-1' fill='none' stroke='%23f37021' stroke-width='1.1' stroke-linecap='round'/%3E%3C/svg%3E"); }

@media (prefers-reduced-motion: reduce) {
  .jet-spinner, .jet-spinner.spool, .btn[aria-busy="true"]::before { animation: tp-jet-spin 2.4s linear infinite; }
}

/* Globe: canvas map underneath, SVG planes and labels on top */
.globe-wrap { position: relative; }
.globe-canvas { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.route-globe { position: relative; z-index: 1; }
.route-globe .g-code { opacity: 0; }
.route-globe .g-code.on { opacity: 1; }
.route-globe .g-code { font: 700 8px "Inter", sans-serif; fill: #fff; paint-order: stroke; stroke: rgba(15, 25, 40, .9); stroke-width: 2.6px; letter-spacing: .02em; transition: opacity .35s; }
.route-globe .g-code.hub { font-size: 9.5px; fill: #fff4e6; }
/* Bigger globe, crisper labels */
.globe-wrap { max-width: 340px; }
@media (max-width: 720px) { .globe-wrap { max-width: 280px; } }
.route-globe .g-code { stroke: rgba(10, 20, 35, .95); stroke-width: 3px; stroke-linejoin: round; }

.route-card { min-width: 0; }

/* ---------- Large screens: use the width instead of a narrow centred column ----------
   From 1400px the page widens to ~90% of the window and the base text size grows with it,
   so everything (headings, cards, globe) scales up in proportion. */
@media (min-width: 1400px) {
  :root { --maxw: min(90vw, 1840px); }
  html { font-size: clamp(16px, calc(8px + .56vw), 22px); }
  body { font-size: 1rem; }
  .container { padding-inline: clamp(20px, 2.5vw, 56px); }
  .site-header .container { height: 4.25rem; }
  .hero { padding: 6rem 0 5.5rem; }
  .hero .lead { max-width: 40rem; }
  .section-head { max-width: 46rem; }
  .faq { max-width: 60rem; }
  .globe-wrap { max-width: 24rem; }
  .route-card { padding: 1.6rem 1.6rem 1.3rem; }
  .destination-grid .destination-card { flex-basis: calc((100% - 72px) / 4); }
  .notice-list > .notice-card { flex-basis: calc((100% - 48px) / 4); }
}
@media (min-width: 2200px) {
  .destination-grid .destination-card { flex-basis: calc((100% - 96px) / 5); }
}

/* ---------- Office photos (Contact) ---------- */
.office { margin-top: 40px; }
.office h3 { margin-bottom: 4px; }
.office-grid { display: grid; grid-template-columns: 2fr 1fr 1fr; gap: 16px; margin-top: 16px; }
.office-photo { position: relative; margin: 0; border-radius: 14px; overflow: hidden; background: #302a25; aspect-ratio: 3 / 4; }
.office-photo.wide { aspect-ratio: auto; }
.office-photo.wide img { position: absolute; inset: 0; }   /* row height comes from the portrait photos */
.office-photo img { display: block; width: 100%; height: 100%; object-fit: cover; }
.office-photo figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 28px 14px 12px; color: #fff; font-weight: 600; font-size: .9rem; background: linear-gradient(transparent, rgba(0,0,0,.7)); }
@media (max-width: 820px) {
  .office-grid { grid-template-columns: 1fr 1fr; }
  .office-photo.wide { grid-column: 1 / -1; aspect-ratio: 7 / 5; }
}

/* ---------- Authorised agent (Services) ---------- */
.agent-card { display: grid; grid-template-columns: 1.2fr 1fr; gap: 20px 32px; align-items: center; margin: 8px 0 40px; padding: 24px 28px; background: #fff; border: 1px solid var(--line); border-top: 4px solid var(--brand); border-radius: 16px; box-shadow: 0 14px 40px -28px rgba(20,20,20,.35); }
.agent-head h3 { font-size: 1.35rem; margin: 0; }
.agent-head .eyebrow { margin-bottom: 6px; }
.agent-logos { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.agent-logos li { display: grid; place-items: center; height: 64px; padding: 10px; border: 1px solid var(--line); border-radius: 12px; background: #fff; }
.agent-logos img { max-width: 100%; max-height: 38px; object-fit: contain; }
.agent-points { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; grid-column: 1 / -1; grid-template-columns: 1fr 1fr; }
.agent-points li { padding: 14px 16px 14px 44px; position: relative; background: #fdf6ec; border-radius: 12px; }
.agent-points li::before { content: "✓"; position: absolute; left: 16px; top: 13px; width: 20px; height: 20px; border-radius: 50%; background: var(--brand); color: #fff; font-size: .75rem; font-weight: 700; display: grid; place-items: center; }
.agent-points strong { display: block; color: var(--char); }
.agent-card > .small { grid-column: 1 / -1; margin: 0; }
@media (max-width: 720px) {
  .agent-card { grid-template-columns: 1fr; padding: 20px; }
  .agent-points { grid-template-columns: 1fr; }
}
.airline-logos li.is-agent { position: relative; border-color: var(--brand); }
.agent-badge { position: absolute; top: -9px; left: 50%; transform: translateX(-50%); padding: 1px 8px; border-radius: 999px; background: var(--brand); color: #fff; font-size: .68rem; font-weight: 700; letter-spacing: .02em; white-space: nowrap; z-index: 1; }
.agent-logos img[alt="AirAsia"] { max-height: 48px; }
