:root {
  color-scheme: light;
  --navy: #0F172A;
  --navy-2: #17243A;
  --emerald: #059669;
  --emerald-dark: #047857;
  --mint: #D1FAE5;
  --amber: #F59E0B;
  --amber-soft: #FEF3C7;
  --ink: #152238;
  --muted: #64748B;
  --line: #DDE5EC;
  --surface: #FFFFFF;
  --bg: #F8FAFC;
  --shell: 1160px;
  --radius: 18px;
  --shadow-soft: 0 14px 42px rgba(15, 23, 42, .07);
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  font-synthesis: none;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 92px; }
body { margin: 0; background: var(--bg); color: var(--ink); font-size: 15px; line-height: 1.55; }
a { color: inherit; text-decoration: none; }
button, select { font: inherit; }
button, a, select { -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, select:focus-visible { outline: 3px solid rgba(5, 150, 105, .46); outline-offset: 3px; }
::selection { background: rgba(5, 150, 105, .18); }
.shell { width: min(var(--shell), calc(100% - 48px)); margin-inline: auto; }
.visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }
.skip-link { position: fixed; z-index: 100; top: 10px; left: 12px; transform: translateY(-140%); padding: 10px 14px; border-radius: 8px; color: white; background: var(--navy); }
.skip-link:focus { transform: translateY(0); }
.site-header { position: sticky; top: 0; z-index: 50; background: rgba(248, 250, 252, .91); border-bottom: 1px solid rgba(221, 229, 236, .8); backdrop-filter: blur(16px); }
.header-inner { display: flex; align-items: center; justify-content: space-between; min-height: 78px; }
.brand { display: inline-flex; align-items: center; gap: 9px; color: var(--navy); }
.brand-mark { display: grid; place-items: center; width: 39px; height: 39px; border-radius: 50%; color: var(--emerald); background: #E8F7F0; }
.brand-mark svg { width: 31px; height: 31px; }
.brand-copy { display: grid; line-height: 1; gap: 4px; }
.brand-copy strong { font-size: 15px; font-weight: 850; letter-spacing: .055em; }
.brand-copy span { font-size: 9px; color: #6B7789; letter-spacing: .19em; font-weight: 750; }
.primary-nav { display: flex; align-items: center; gap: clamp(18px, 2.45vw, 34px); }
.primary-nav > a { color: #475569; font-weight: 600; font-size: 12px; transition: color .2s ease; }
.primary-nav > a:hover { color: var(--emerald-dark); }
.primary-nav .nav-cta { display: inline-flex; align-items: center; gap: 10px; padding: 11px 16px; color: white; background: var(--navy); border-radius: 999px; font-size: 12px; box-shadow: 0 4px 12px rgba(15, 23, 42, .12); }
.primary-nav .nav-cta:hover { color: white; background: #1E293B; transform: translateY(-1px); }
.nav-cta span { color: #6EE7B7; font-size: 15px; }
.nav-toggle { display: none; border: 0; background: transparent; color: var(--navy); }

.hero { position: relative; display: grid; grid-template-columns: 1fr 1.04fr; align-items: center; min-height: 472px; margin-top: 26px; padding: 50px 54px 54px; overflow: hidden; color: white; border-radius: 25px; background: var(--navy); isolation: isolate; }
.hero::before { position: absolute; z-index: -1; inset: 0; content: ""; opacity: .2; background-image: radial-gradient(rgba(148, 163, 184, .52) .65px, transparent .65px); background-size: 18px 18px; mask-image: linear-gradient(90deg, transparent, #000 49%, #000); }
.hero::after { position: absolute; z-index: -1; top: -190px; right: -190px; width: 570px; height: 570px; content: ""; border-radius: 50%; background: radial-gradient(circle, rgba(5, 150, 105, .19), transparent 66%); }
.hero-copy { position: relative; z-index: 2; max-width: 540px; padding-bottom: 33px; }
.eyebrow { display: flex; align-items: center; gap: 9px; margin: 0 0 15px; color: #75E0B4; font-size: 10px; font-weight: 800; letter-spacing: .15em; text-transform: uppercase; }
.eyebrow-dot { width: 7px; height: 7px; border-radius: 50%; background: var(--amber); box-shadow: 0 0 0 4px rgba(245, 158, 11, .15); }
.hero h1 { max-width: 580px; margin: 0; font-size: clamp(40px, 5.2vw, 65px); line-height: 1.02; letter-spacing: -.065em; font-weight: 760; }
.hero h1 em, .faq-intro h2 em, .final-cta h2 em { color: #71D9B1; font-style: normal; }
.hero-lede { max-width: 440px; margin: 19px 0 0; color: #C7D2DF; font-size: 15px; line-height: 1.7; }
.hero-actions { display: flex; align-items: center; gap: 22px; margin-top: 26px; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 13px; min-height: 46px; padding: 0 19px; border: 0; border-radius: 9px; cursor: pointer; font-size: 12px; font-weight: 750; transition: transform .2s ease, box-shadow .2s ease, background .2s ease; }
.button:hover { transform: translateY(-2px); }
.button span { font-size: 16px; transition: transform .2s ease; }
.button:hover span { transform: translateX(3px); }
.button-primary { color: white; background: var(--emerald); box-shadow: 0 8px 20px rgba(5, 150, 105, .22); }
.button-primary:hover { background: #07A87A; box-shadow: 0 11px 24px rgba(5, 150, 105, .27); }
.text-link { display: inline-flex; align-items: center; gap: 9px; color: var(--emerald-dark); font-size: 12px; font-weight: 750; transition: gap .2s ease; }
.text-link:hover { gap: 13px; }
.text-link-light { color: #D3DEEA; }
.text-link-light:hover { color: #75E0B4; }
.hero-proof { display: flex; align-items: center; gap: 9px; margin-top: 28px; color: #ABB9C9; font-size: 10px; letter-spacing: .01em; }
.proof-icon { display: grid; place-items: center; width: 18px; height: 18px; color: var(--amber); font-size: 13px; border: 1px solid rgba(245, 158, 11, .4); border-radius: 50%; }
.hero-art { position: relative; min-height: 330px; align-self: stretch; }
.art-orbit { position: absolute; top: 48%; left: 50%; transform: translate(-50%, -50%); width: 370px; height: 230px; border: 1px solid rgba(175, 199, 222, .11); border-radius: 50%; }
.orbit-two { width: 490px; height: 300px; transform: translate(-50%, -50%) rotate(-24deg); }
.route-line { position: absolute; top: 1px; left: 50%; width: min(100%, 530px); height: 340px; transform: translateX(-48%); overflow: visible; }
.route-label { position: absolute; display: flex; align-items: center; gap: 8px; padding: 7px 11px; color: #DBE7F0; background: rgba(34, 48, 69, .88); border: 1px solid rgba(203, 213, 225, .12); border-radius: 99px; font-size: 9px; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; }
.route-label-top { top: 5px; right: 10px; }
.route-pin { width: 6px; height: 6px; border-radius: 50%; background: var(--amber); }
.map-tag { position: absolute; display: flex; align-items: center; gap: 6px; padding: 6px 9px; color: #D8E4EF; border-radius: 7px; border: 1px solid rgba(203, 213, 225, .13); background: rgba(15, 23, 42, .78); font-size: 9px; font-weight: 600; }
.tag-dot { width: 5px; height: 5px; border-radius: 50%; background: #6EE7B7; }
.tag-bangkok { top: 43%; left: 28%; }.tag-hanoi { top: 21%; right: 9%; }.tag-kl { top: 66%; left: 49%; }
.route-card { position: absolute; right: 7px; bottom: 14px; width: 248px; padding: 18px 18px 14px; border: 1px solid rgba(203, 213, 225, .16); border-radius: 14px; color: white; background: linear-gradient(145deg, rgba(34, 48, 69, .98), rgba(24, 36, 55, .95)); box-shadow: 0 18px 45px rgba(0,0,0,.22); }
.route-card-kicker { color: #9AACBC; font-size: 8px; font-weight: 800; letter-spacing: .16em; }
.route-card-stats { display: flex; align-items: center; gap: 7px; margin-top: 12px; }
.route-card-stats > strong { color: #7AE0B8; font-size: 31px; line-height: 1; letter-spacing: -.06em; }
.route-card-stats > span { color: #D2DCE7; font-size: 8px; line-height: 1.4; }
.route-card-stats i { width: 1px; height: 25px; margin: 0 4px 0 10px; background: rgba(203, 213, 225, .23); }
.route-card a { display: flex; justify-content: space-between; align-items: center; margin-top: 15px; padding-top: 11px; color: #E9F2FA; border-top: 1px solid rgba(203, 213, 225, .14); font-size: 9px; font-weight: 700; }
.route-card a span { color: var(--amber); font-size: 13px; }
.art-coordinates { position: absolute; bottom: 1px; left: 12px; color: #7C8DA3; font: 9px/1 ui-monospace, SFMono-Regular, Menlo, monospace; letter-spacing: .08em; }
.art-coordinates span { padding: 0 5px; color: var(--amber); }
.hero-search { position: relative; z-index: 4; display: grid; grid-template-columns: 1fr 185px 134px; align-items: center; gap: 12px; width: min(720px, calc(100% - 80px)); min-height: 78px; margin: -39px auto 0; padding: 12px 13px 12px 19px; border: 1px solid #E1E8EF; border-radius: 14px; background: white; color: var(--ink); box-shadow: 0 15px 35px rgba(15, 23, 42, .13); }
.hero-search-copy { display: flex; align-items: center; gap: 12px; }
.search-icon { display: grid; place-items: center; width: 36px; height: 36px; border-radius: 10px; color: var(--emerald); background: #E9F8F1; font-size: 24px; transform: rotate(-15deg); }
.hero-search-copy strong, .hero-search-copy small { display: block; }
.hero-search-copy strong { font-size: 11px; }
.hero-search-copy small { margin-top: 3px; color: var(--muted); font-size: 9px; }
.hero-search select, .checker-form select { width: 100%; min-height: 42px; padding: 0 34px 0 12px; border: 1px solid var(--line); border-radius: 8px; color: var(--ink); background: white; cursor: pointer; }
.hero-search .button-dark { min-height: 44px; color: white; background: var(--navy); font-size: 10px; }
.hero-search .button-dark:hover { background: #24334B; }
.trust-strip { margin-top: 25px; border-bottom: 1px solid var(--line); background: rgba(255,255,255,.55); }
.trust-inner { display: flex; align-items: center; justify-content: center; gap: clamp(22px, 4vw, 54px); min-height: 54px; }
.trust-item { display: flex; align-items: center; gap: 9px; color: #64748B; font-size: 10px; font-weight: 600; }
.trust-check { display: grid; place-items: center; width: 17px; height: 17px; color: var(--emerald-dark); border-radius: 50%; background: #DDF6E9; font-size: 10px; font-weight: 800; }
.trust-divider { height: 17px; width: 1px; background: var(--line); }

.section { padding: 94px 0; }
.section-heading { margin-bottom: 34px; }
.section-heading-row { display: flex; justify-content: space-between; align-items: end; gap: 28px; }
.eyebrow-green { color: var(--emerald-dark); }
.eyebrow-amber { color: #B26A00; }
.section-heading h2, .faq-intro h2 { margin: 0; color: var(--navy); font-size: clamp(34px, 4vw, 46px); line-height: 1.08; letter-spacing: -.055em; font-weight: 750; }
.heading-period { color: var(--emerald); }
.section-intro { max-width: 610px; margin: 11px 0 0; color: var(--muted); font-size: 13px; }
.section-index { flex: none; padding-bottom: 7px; color: #8290A2; font-size: 9px; font-weight: 800; letter-spacing: .15em; }
.section-index span { padding: 0 5px; color: var(--amber); }
.section-checker { padding-top: 85px; }
.checker-layout { display: grid; grid-template-columns: .88fr 1.12fr; gap: 24px; align-items: stretch; }
.checker-form { position: relative; padding: 27px; border: 1px solid var(--line); border-radius: var(--radius); background: white; }
.form-step { position: relative; display: grid; grid-template-columns: 28px 1fr; gap: 13px; }
.step-number { display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; color: var(--emerald-dark); background: #E5F7EF; font-size: 10px; font-weight: 800; }
.form-step label { display: block; margin: 3px 0 3px; color: var(--navy); font-size: 13px; font-weight: 750; }
.form-step p { margin: 0 0 12px; color: #8793A3; font-size: 10px; }
.form-step select { min-height: 46px; font-size: 12px; }
.form-connector { height: 24px; width: 1px; margin: 0 0 0 13px; border-left: 1px dashed #BDC9D5; }
.checker-submit { width: calc(100% - 40px); margin: 21px 0 0 40px; }
.form-footnote { margin: 13px 0 0 40px; color: #8491A1; font-size: 9px; }
.form-footnote span { margin-right: 4px; color: var(--emerald); }
.result-card { position: relative; padding: 25px 27px 21px; overflow: hidden; border-radius: var(--radius); color: white; background: var(--navy); box-shadow: 0 18px 38px rgba(15, 23, 42, .1); }
.result-card::before { position: absolute; top: -130px; right: -100px; width: 300px; height: 300px; content: ""; border-radius: 50%; background: radial-gradient(circle, rgba(5, 150, 105, .15), transparent 66%); }
.result-topline, .result-route, .result-status-row, .result-detail-grid, .document-checklist, .result-caveat { position: relative; }
.result-topline { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.result-label { display: inline-flex; align-items: center; gap: 8px; color: #B3C2D3; font-size: 8px; letter-spacing: .15em; font-weight: 800; }
.result-pulse { position: relative; width: 7px; height: 7px; border-radius: 50%; background: #6EE7B7; }
.result-pulse::after { position: absolute; inset: -4px; border: 1px solid rgba(110,231,183,.35); border-radius: 50%; content: ""; }
.result-date { padding: 5px 8px; color: #FFD37B; background: rgba(245,158,11,.1); border: 1px solid rgba(245,158,11,.22); border-radius: 99px; font-size: 7px; font-weight: 800; letter-spacing: .1em; }
.result-route { display: flex; align-items: center; gap: 12px; margin-top: 18px; color: #D7E1EB; font-size: 11px; font-weight: 650; }
.route-arrow { color: var(--amber); font-size: 14px; }
.result-status-row { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-top: 14px; padding-bottom: 15px; border-bottom: 1px solid rgba(203,213,225,.14); }
.result-eyebrow { margin: 0 0 4px; color: #93A4B7; font-size: 9px; font-weight: 800; letter-spacing: .14em; }
.result-status-row h3 { margin: 0; color: white; font-size: 22px; line-height: 1.12; letter-spacing: -.04em; }
.result-context { margin: 6px 0 0; color: #9EADC0; font-size: 10px; }
.status-pill { flex: none; display: inline-flex; align-items: center; gap: 7px; padding: 7px 10px; border-radius: 99px; font-size: 10px; font-weight: 750; white-space: nowrap; }
.status-pill::before { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; }
.status-required { color: #FFD37B; background: rgba(245,158,11,.13); border: 1px solid rgba(245,158,11,.2); }
.status-free { color: #83E2B8; background: rgba(5,150,105,.13); border: 1px solid rgba(5,150,105,.24); }
.status-evisa { color: #A5C8FF; background: rgba(59,130,246,.14); border: 1px solid rgba(96,165,250,.23); }
.status-arrival { color: #D3B4FF; background: rgba(139,92,246,.14); border: 1px solid rgba(167,139,250,.23); }
.status-verify { color: #D0DAE5; background: rgba(148,163,184,.15); border: 1px solid rgba(148,163,184,.2); }
.result-detail-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; padding: 15px 0; border-bottom: 1px solid rgba(203,213,225,.14); }
.detail-cell { display: flex; align-items: center; gap: 10px; min-width: 0; }
.detail-icon { display: grid; place-items: center; flex: none; width: 29px; height: 29px; color: #80DDBC; border-radius: 8px; background: rgba(5,150,105,.15); font-size: 16px; }
.detail-caption { display: block; margin-bottom: 2px; color: #92A3B6; font-size: 9px; }
.detail-cell strong, .detail-cell a { display: inline-block; color: #F4F7FA; font-size: 10px; line-height: 1.4; font-weight: 700; }
.detail-cell a { color: #73DBB1; text-decoration: underline; text-underline-offset: 3px; }
.document-checklist { padding-top: 14px; }
.checklist-title { margin: 0 0 8px; color: #91A1B4; font-size: 8px; font-weight: 800; letter-spacing: .14em; }
.document-checklist ul { display: grid; grid-template-columns: 1fr 1fr; gap: 6px 14px; margin: 0; padding: 0; list-style: none; }
.document-checklist li { display: flex; align-items: flex-start; gap: 7px; color: #D4DFEA; font-size: 10px; line-height: 1.45; }
.document-checklist li span { color: #68D5A9; font-weight: 900; }
.result-caveat { margin: 13px 0 0; padding-top: 10px; border-top: 1px solid rgba(203,213,225,.12); color: #8FA0B4; font-size: 10px; line-height: 1.5; }
.checker-source-note { display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start; margin-top: 14px; padding: 12px 15px; border: 1px solid #E3E9EE; border-radius: 10px; background: rgba(255,255,255,.7); }
.source-badge { padding: 5px 7px; color: #597164; border-radius: 5px; background: #E8F7EF; font-size: 7px; font-weight: 800; letter-spacing: .1em; }
.checker-source-note p { margin: 0; color: #708093; font-size: 10px; line-height: 1.55; }
.checker-source-note a { color: var(--emerald-dark); text-decoration: underline; text-underline-offset: 2px; }
.checker-source-note a + a { margin-left: 9px; }

.section-unified { padding-top: 90px; background: #F0F5F6; }
.section-unified .section-heading { margin-bottom: 31px; }
.section-unified .section-heading h2 { font-size: clamp(34px, 4.5vw, 50px); }
.section-unified .section-heading h2 em { color: var(--emerald-dark); font-style: normal; }
.unified-panel { display: grid; grid-template-columns: .9fr 1.1fr; overflow: hidden; border: 1px solid #DDE7E5; border-radius: 19px; background: white; box-shadow: var(--shadow-soft); }
.unified-copy { position: relative; padding: 32px; color: white; background: var(--navy); }
.unified-copy::after { position: absolute; right: -20px; bottom: 40px; width: 100px; height: 100px; border: 1px solid rgba(255,255,255,.08); border-radius: 50%; content: ""; box-shadow: 0 0 0 18px rgba(255,255,255,.025), 0 0 0 36px rgba(255,255,255,.02); }
.proposal-stamp { display: inline-flex; align-items: center; gap: 7px; padding: 6px 9px; color: #FFE0A0; background: rgba(245,158,11,.12); border: 1px solid rgba(245,158,11,.2); border-radius: 99px; font-size: 8px; font-weight: 750; letter-spacing: .06em; }
.stamp-mark { color: var(--amber); }
.unified-copy h3 { position: relative; z-index: 1; margin: 18px 0 11px; font-size: 29px; line-height: 1.08; letter-spacing: -.04em; }
.unified-copy > p { position: relative; z-index: 1; max-width: 360px; margin: 0; color: #B8C7D6; font-size: 11px; line-height: 1.7; }
.unified-copy .text-link { position: relative; z-index: 1; margin-top: 15px; color: #79E2BB; font-size: 10px; }
.official-update { position: relative; z-index: 1; display: flex; gap: 10px; align-items: flex-start; margin-top: 23px; padding: 12px; border: 1px solid rgba(203,213,225,.14); border-radius: 10px; background: rgba(255,255,255,.045); }
.official-icon { flex: none; display: grid; place-items: center; width: 18px; height: 18px; color: var(--navy); border-radius: 50%; background: var(--amber); font-size: 10px; font-weight: 900; font-family: Georgia, serif; }
.official-update p { margin: 0; color: #CFD9E3; font-size: 10px; line-height: 1.6; }
.official-update strong { color: #FFE0A0; }
.timeline-wrap { padding: 30px 31px 24px; }
.timeline-heading { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 26px; }
.timeline-heading > span:first-child { color: #66758A; font-size: 8px; font-weight: 850; letter-spacing: .16em; }
.timeline-status { display: flex; align-items: center; gap: 7px; padding: 6px 9px; color: var(--emerald-dark); border-radius: 99px; background: #E7F8EF; font-size: 8px; font-weight: 750; }
.timeline-status i { width: 6px; height: 6px; border-radius: 50%; background: var(--emerald); box-shadow: 0 0 0 3px #C9F1DD; }
.timeline { position: relative; display: grid; grid-template-columns: repeat(4, 1fr); }
.timeline::before, .timeline::after { position: absolute; z-index: 0; top: 16px; left: 17px; height: 2px; content: ""; }
.timeline::before { right: 18px; background: #E4EAF0; }
.timeline::after { width: calc(33.333% - 4px); background: linear-gradient(90deg, #059669, #A7F3D0); }
.timeline-step { position: relative; z-index: 1; display: flex; flex-direction: column; align-items: flex-start; padding: 0; border: 0; background: transparent; text-align: left; cursor: pointer; }
.timeline-node { display: grid; place-items: center; width: 33px; height: 33px; border: 2px solid #DDE5EC; border-radius: 50%; color: #8794A4; background: white; transition: .2s ease; }
.timeline-node > span { display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: #EEF2F6; font-size: 8px; font-weight: 800; }
.timeline-step.done .timeline-node { color: white; border-color: var(--emerald); background: white; }
.timeline-step.done .timeline-node > span { background: var(--emerald); }
.timeline-step.current .timeline-node { border-color: var(--amber); box-shadow: 0 0 0 4px rgba(245,158,11,.12); }
.timeline-step.current .timeline-node > span { color: var(--navy); background: #FFE4A8; }
.timeline-step[aria-pressed="true"] .timeline-node { transform: scale(1.04); }
.timeline-name { margin-top: 12px; color: #526176; font-size: 10px; font-weight: 750; }
.timeline-step.current .timeline-name { color: var(--navy); }
.timeline-sub { margin-top: 3px; color: #929EAC; font-size: 9px; }
.timeline-detail { display: flex; align-items: flex-start; gap: 10px; margin-top: 22px; padding: 12px 13px; border: 1px solid #E1E9E7; border-radius: 10px; background: #F5FAF8; }
.timeline-detail-icon { display: grid; place-items: center; flex: none; width: 21px; height: 21px; color: var(--emerald-dark); border-radius: 7px; background: #E1F6EA; font-size: 12px; }
.timeline-detail p { margin: 0; color: #778495; font-size: 10px; line-height: 1.55; }
.timeline-detail p strong { color: #344258; }
.timeline-source { display: flex; flex-wrap: wrap; gap: 14px; margin-top: 12px; }
.timeline-source a { color: #657487; font-size: 10px; text-decoration: underline; text-underline-offset: 2px; }

.section-states { background: var(--bg); }
.states-count { color: #718094; font-size: 10px; }
.states-count strong { margin-right: 4px; color: var(--navy); font-size: 13px; }
.state-toolbar { display: flex; justify-content: space-between; align-items: center; margin: -8px 0 15px; }
.state-toolbar-note { display: flex; align-items: center; gap: 7px; color: #8995A4; font-size: 9px; }
.live-dot { width: 6px; height: 6px; border-radius: 50%; background: var(--emerald); box-shadow: 0 0 0 3px #DDF6E9; }
.states-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px; }
.state-card { position: relative; display: flex; flex-direction: column; min-height: 214px; padding: 18px 17px 14px; overflow: hidden; border: 1px solid #E0E7ED; border-radius: 13px; background: white; transition: transform .24s ease, box-shadow .24s ease, border-color .24s ease; }
.state-card::after { position: absolute; top: -35px; right: -40px; width: 90px; height: 90px; content: ""; border-radius: 50%; background: rgba(5,150,105,.035); transition: transform .25s ease, background .25s ease; }
.state-card:hover { transform: translateY(-4px); border-color: #B5DDCB; box-shadow: 0 13px 27px rgba(15,23,42,.08); }
.state-card:hover::after { transform: scale(1.8); background: rgba(5,150,105,.065); }
.state-card-head { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: flex-start; }
.state-flag { display: grid; place-items: center; width: 39px; height: 39px; border: 1px solid #EBEFF3; border-radius: 11px; background: #FAFBFC; font-size: 21px; }
.state-region { color: #8B98A7; font-size: 8px; font-weight: 850; letter-spacing: .12em; text-transform: uppercase; }
.state-card h3 { position: relative; z-index: 1; margin: 12px 0 2px; color: var(--navy); font-size: 14px; letter-spacing: -.02em; }
.state-capital { margin: 0; color: #738196; font-size: 10px; }
.state-stay { margin-top: 12px; padding: 8px 9px; border-radius: 8px; background: #F4F8F7; color: #647487; font-size: 10px; line-height: 1.45; }
.state-stay strong { color: #395649; }
.state-link { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: center; min-height: 40px; margin-top: auto; padding: 9px 2px 0; color: var(--emerald-dark); font-size: 10px; font-weight: 750; }
.state-link span { font-size: 13px; transition: transform .2s ease; }
.state-link:hover span { transform: translate(2px, -2px); }
.state-card-timor { border-color: #EDCCAF; background: #FFFCF7; }
.state-card-timor .state-stay { background: #FFF2DF; color: #755D36; }
.state-card-timor .state-stay strong { color: #8A5908; }
.state-card-timor .state-link { color: #8A5908; }
.states-bottom-note { display: flex; align-items: center; gap: 11px; margin-top: 17px; padding: 12px 14px; border: 1px solid #E5E9EA; border-radius: 10px; background: rgba(255,255,255,.72); }
.notice-icon { display: grid; place-items: center; flex: none; width: 21px; height: 21px; color: #735007; border-radius: 50%; background: #FEEDC6; font: 800 12px Georgia, serif; }
.states-bottom-note p { flex: 1; margin: 0; color: #758195; font-size: 10px; line-height: 1.5; }
.states-bottom-note p strong { color: #405066; }
.states-bottom-note > a { flex: none; color: var(--emerald-dark); font-size: 10px; font-weight: 750; }

.section-faq { padding: 86px 0 92px; background: #F0F5F6; }
.faq-layout { display: grid; grid-template-columns: .65fr 1.35fr; gap: 80px; align-items: start; }
.faq-intro { position: sticky; top: 110px; }
.faq-intro h2 { font-size: 42px; }
.faq-intro h2 em { color: var(--emerald-dark); }
.faq-intro > p:not(.eyebrow) { max-width: 285px; margin: 15px 0 17px; color: #738196; font-size: 12px; }
.faq-list { border-top: 1px solid #D9E2E5; }
.faq-item { border-bottom: 1px solid #D9E2E5; }
.faq-item h3 { margin: 0; }
.faq-question { display: grid; grid-template-columns: 33px 1fr 26px; gap: 12px; align-items: center; width: 100%; padding: 18px 0; border: 0; color: var(--navy); background: transparent; text-align: left; cursor: pointer; }
.faq-number { color: #93A1B0; font-size: 8px; font-weight: 800; letter-spacing: .09em; }
.faq-question > span:nth-child(2) { font-size: 12px; font-weight: 730; }
.faq-chevron { display: grid; place-items: center; width: 25px; height: 25px; border: 1px solid #DDE4E9; border-radius: 50%; color: #607084; font-size: 14px; transition: .2s ease; }
.faq-item.is-open .faq-chevron { color: white; border-color: var(--emerald); background: var(--emerald); }
.faq-answer { padding: 0 38px 18px 45px; }
.faq-answer[hidden] { display: none; }
.faq-answer p { margin: 0; color: #728093; font-size: 11px; line-height: 1.75; }
.faq-answer strong { color: var(--navy); }
.faq-answer a { color: var(--emerald-dark); text-decoration: underline; text-underline-offset: 2px; }
.final-cta { padding: 48px 0; color: white; background: var(--navy); }
.final-cta-inner { display: flex; justify-content: space-between; align-items: center; gap: 30px; }
.eyebrow-light { margin-bottom: 9px; color: #91E5C5; }
.final-cta h2 { margin: 0; font-size: clamp(26px, 3vw, 36px); line-height: 1.13; letter-spacing: -.045em; }
.final-cta h2 em { color: #75DBB4; }
.button-light { flex: none; color: var(--navy); background: white; }
.button-light:hover { background: #EAF7F1; box-shadow: 0 9px 24px rgba(255,255,255,.1); }
.site-footer { color: white; background: #0B1220; }
.footer-main { display: flex; justify-content: space-between; gap: 45px; padding-top: 41px; padding-bottom: 31px; }
.brand-footer { color: white; }
.brand-footer .brand-mark { color: #78DEB7; background: rgba(5,150,105,.16); }
.brand-footer .brand-copy span { color: #8391A4; }
.footer-brand > p { max-width: 235px; margin: 14px 0 0; color: #8290A2; font-size: 10px; }
.footer-links { display: flex; gap: clamp(40px, 8vw, 110px); }
.footer-links > div { display: grid; grid-auto-rows: min-content; gap: 8px; }
.footer-links h3 { margin: 1px 0 5px; color: #6D7B8F; font-size: 8px; letter-spacing: .14em; }
.footer-links a { color: #B4C0CF; padding-block: 3px; font-size: 10px; transition: color .2s ease; }
.footer-links a:hover { color: #83E4BC; }
.footer-bottom { display: grid; grid-template-columns: 1fr auto auto; gap: 25px; align-items: center; min-height: 49px; border-top: 1px solid rgba(203,213,225,.11); color: #748195; font-size: 8px; }
.footer-bottom p { margin: 0; }
.footer-bottom > span { white-space: nowrap; }
.back-to-top { color: #CED7E2; white-space: nowrap; }
.back-to-top:hover { color: #82E3B9; }

@media (min-width: 1400px) { .hero { min-height: 500px; } }
@media (max-width: 950px) {
  .shell { width: min(var(--shell), calc(100% - 36px)); }
  .hero { grid-template-columns: 1fr .8fr; padding: 45px 38px 52px; }
  .hero h1 { font-size: clamp(38px, 5.6vw, 58px); }
  .hero-art { min-height: 300px; }
  .hero-search { width: min(700px, calc(100% - 50px)); }
  .primary-nav { gap: 16px; }
  .primary-nav > a { font-size: 10px; }
  .checker-layout { grid-template-columns: .86fr 1.14fr; gap: 16px; }
  .checker-form { padding: 22px; }
  .result-card { padding: 22px; }
  .faq-layout { gap: 48px; }
}
@media (max-width: 760px) {
  html { scroll-padding-top: 78px; }
  .shell { width: calc(100% - 32px); }
  .header-inner { min-height: 68px; }
  .nav-toggle { display: flex; flex-direction: column; justify-content: center; gap: 5px; width: 42px; height: 42px; padding: 9px; border: 1px solid #DDE5EC; border-radius: 10px; cursor: pointer; }
  .nav-toggle span { width: 100%; height: 2px; border-radius: 2px; background: var(--navy); transition: transform .2s ease, opacity .2s ease; }
  .nav-toggle[aria-expanded="true"] span:first-child { transform: translateY(7px) rotate(45deg); }
  .nav-toggle[aria-expanded="true"] span:nth-child(2) { opacity: 0; }
  .nav-toggle[aria-expanded="true"] span:last-child { transform: translateY(-7px) rotate(-45deg); }
  .primary-nav { position: absolute; top: calc(100% + 1px); left: 0; right: 0; display: flex; flex-direction: column; align-items: stretch; gap: 0; padding: 9px 16px 15px; border-bottom: 1px solid #DDE5EC; background: rgba(248,250,252,.98); box-shadow: 0 17px 22px rgba(15,23,42,.08); opacity: 0; visibility: hidden; transform: translateY(-8px); transition: opacity .2s ease, transform .2s ease, visibility .2s; }
  .primary-nav.is-open { opacity: 1; visibility: visible; transform: translateY(0); }
  .primary-nav > a { padding: 12px 5px; border-bottom: 1px solid #E8EDF1; font-size: 12px; }
  .primary-nav > a.nav-cta { justify-content: center; margin-top: 11px; border-bottom: 0; font-size: 12px; }
  .hero { grid-template-columns: 1fr; min-height: auto; margin-top: 14px; padding: 37px 24px 18px; border-radius: 20px; }
  .hero-copy { padding-bottom: 0; }
  .hero h1 { max-width: 480px; font-size: clamp(41px, 9vw, 60px); }
  .hero-lede { max-width: 500px; margin-top: 15px; font-size: 13px; }
  .hero-actions { gap: 16px; margin-top: 20px; }
  .button { min-height: 43px; padding-inline: 15px; font-size: 11px; }
  .hero-proof { margin-top: 18px; font-size: 9px; }
  .hero-art { min-height: 255px; margin: 15px -10px 0; }
  .route-line { top: -4px; width: 100%; height: 270px; }
  .art-orbit { top: 48%; width: 65%; height: 180px; }
  .orbit-two { width: 96%; height: 230px; }
  .route-card { right: 0; bottom: 1px; width: 220px; padding: 13px 14px 11px; }
  .route-card-stats { margin-top: 8px; }
  .route-card-stats > strong { font-size: 27px; }
  .route-card a { margin-top: 9px; padding-top: 8px; }
  .tag-hanoi { right: 2%; }.tag-bangkok { left: 16%; }.tag-kl { left: 41%; top: 63%; }
  .art-coordinates { bottom: 5px; left: 0; font-size: 7px; }
  .hero-search { grid-template-columns: 1fr auto; gap: 8px; width: 100%; margin-top: 0; padding: 12px; }
  .hero-search-copy { grid-column: 1 / -1; padding: 2px 2px 4px; }
  .hero-search select { min-height: 41px; }
  .hero-search .button-dark { min-width: 125px; }
  .trust-strip { margin-top: 15px; }
  .trust-inner { justify-content: flex-start; gap: 14px; min-height: 49px; overflow-x: auto; scrollbar-width: none; }
  .trust-inner::-webkit-scrollbar { display: none; }
  .trust-item { flex: none; font-size: 8px; }
  .trust-divider { flex: none; height: 14px; }
  .section { padding: 66px 0; }
  .section-checker { padding-top: 62px; }
  .section-heading-row { align-items: flex-start; gap: 12px; }
  .section-heading h2, .faq-intro h2 { font-size: clamp(32px, 8vw, 42px); }
  .section-intro { font-size: 11px; }
  .section-index { padding-top: 4px; white-space: nowrap; font-size: 7px; }
  .checker-layout { grid-template-columns: 1fr; gap: 13px; }
  .checker-form { padding: 20px; }
  .result-card { padding: 21px 19px; }
  .result-status-row h3 { font-size: 20px; }
  .checker-source-note { grid-template-columns: 1fr; gap: 8px; }
  .checker-source-note p { line-height: 1.6; }
  .section-unified { padding-top: 66px; }
  .section-unified .section-heading h2 { font-size: clamp(32px, 8vw, 44px); }
  .unified-panel { grid-template-columns: 1fr; }
  .unified-copy { padding: 25px 23px; }
  .unified-copy h3 { font-size: 27px; }
  .timeline-wrap { padding: 23px 21px 20px; }
  .timeline-heading { align-items: flex-start; flex-direction: column; margin-bottom: 22px; }
  .timeline-name { font-size: 9px; }
  .timeline-sub { font-size: 9px; }
  .timeline::after { width: calc(33.333% - 4px); }
  .timeline-step:nth-child(3) .timeline-name, .timeline-step:nth-child(4) .timeline-name { max-width: 70px; }
  .section-states { padding-top: 65px; }
  .states-grid { grid-template-columns: repeat(2, 1fr); gap: 9px; }
  .state-card { min-height: 208px; padding: 14px 13px 12px; }
  .state-card h3 { font-size: 12px; }
  .state-capital { font-size: 10px; }
  .state-stay { font-size: 10px; }
  .state-link { min-height: 42px; font-size: 10px; }
  .state-region { font-size: 8px; }
  .state-toolbar-note { font-size: 10px; }
  .states-bottom-note { flex-wrap: wrap; align-items: flex-start; }
  .states-bottom-note p { min-width: calc(100% - 34px); }
  .states-bottom-note > a { margin-left: 32px; }
  .section-faq { padding: 65px 0; }
  .faq-layout { grid-template-columns: 1fr; gap: 28px; }
  .faq-intro { position: static; }
  .faq-intro h2 { font-size: 36px; }
  .faq-intro > p:not(.eyebrow) { max-width: 360px; margin: 12px 0; font-size: 11px; }
  .faq-question { grid-template-columns: 24px 1fr 25px; gap: 9px; padding: 15px 0; }
  .faq-question > span:nth-child(2) { font-size: 11px; }
  .faq-answer { padding: 0 26px 16px 33px; }
  .faq-answer p { font-size: 11px; }
  .final-cta { padding: 35px 0; }
  .final-cta-inner { flex-direction: column; align-items: flex-start; gap: 18px; }
  .final-cta h2 { font-size: 29px; }
  .footer-main { flex-direction: column; gap: 27px; padding-top: 31px; }
  .footer-links { justify-content: flex-start; gap: 35px; }
  .footer-links > div { gap: 7px; }
  .footer-bottom { grid-template-columns: 1fr auto; gap: 7px 14px; padding-top: 13px; padding-bottom: 14px; }
  .footer-bottom p { grid-column: 1 / -1; max-width: 480px; font-size: 9px; line-height: 1.5; }
}
@media (max-width: 390px) {
  .shell { width: calc(100% - 26px); }
  .hero { padding-inline: 19px; }
  .hero h1 { font-size: 39px; }
  .hero-actions { gap: 12px; }
  .hero-actions .button { padding-inline: 12px; }
  .hero-actions .text-link { font-size: 10px; }
  .hero-art { margin-inline: -9px; }
  .route-card { width: 195px; }
  .route-label-top { right: 2px; }
  .result-detail-grid { grid-template-columns: 1fr; gap: 10px; }
  .document-checklist ul { grid-template-columns: 1fr; }
  .timeline-name { font-size: 9px; }
  .state-card { min-height: 213px; }
  .state-card h3 { font-size: 11px; }
  .footer-links { gap: 21px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}