/* Keep the supplied artwork intact; cropping split the mark and made it look soft. */
.nav .logo,.foot-brand .logo{display:inline-flex;align-items:center;flex:0 0 auto}
.nav .logo-img,.foot-brand .logo-img{display:block;width:150px!important;height:auto!important;max-width:none!important;object-fit:contain;flex:0 0 auto}
.foot-brand .logo-img{width:165px!important}
.language-switch{display:inline-flex;align-items:center;justify-content:center;min-height:40px;padding:0 11px;border:1px solid #7778;border-radius:2px;color:#fff;font:750 11px/1 Arial,sans-serif;letter-spacing:.1em;text-decoration:none;white-space:nowrap;transition:background .2s,border-color .2s}
.language-switch:hover,.language-switch:focus-visible{background:#e83828;border-color:#e83828;color:#fff}
/* A compact airport service-desk sign for the primary inquiry route. */
.nav>a.cta{display:flex;align-items:flex-end;position:relative;min-width:202px;min-height:68px;padding:31px 43px 11px 17px!important;border:1px solid #d8d3c8;border-left:5px solid #e1261b;border-radius:2px!important;background:#f4f0e7!important;color:#18252b!important;box-shadow:0 6px 0 #0005!important;font-size:16px!important;font-weight:800;line-height:1.15;letter-spacing:-.03em!important;text-transform:none;white-space:nowrap;transition:background .2s,transform .2s,box-shadow .2s}
.nav>a.cta::before{content:'GATE 01  /  INQUIRY';position:absolute;inset:10px auto auto 17px;display:block;width:max-content;height:auto;background:none;opacity:1;color:#a62d24;font:800 9px/1.2 Arial,sans-serif;letter-spacing:.16em;transition:none}
.nav>a.cta::after{content:'↗';position:absolute;inset:0 0 0 auto;display:flex;align-items:center;justify-content:center;width:34px;height:100%;background:#e1261b;color:#fff;font:800 20px/1 Arial,sans-serif;letter-spacing:0}
.nav>a.cta:hover,.nav>a.cta:focus-visible{background:#fff!important;transform:translateY(-2px);box-shadow:0 8px 0 #0005!important;outline-offset:3px}
.mobile-menu a.wayfinding-link[href$="contact.html"]{position:relative;margin-top:8px;padding:37px 15px 14px!important;border:1px solid #d8d3c8;border-left:5px solid #e1261b;background:#f4f0e7;color:#18252b!important}
.mobile-menu a.wayfinding-link[href$="contact.html"]::before{content:'GATE 01  /  INQUIRY';position:absolute;top:12px;left:15px;color:#a62d24;font:800 10px/1.2 Arial,sans-serif;letter-spacing:.14em}
.mobile-menu a.wayfinding-link[href$="contact.html"] .wf-icon{display:none}
.mobile-menu a.wayfinding-link[href$="contact.html"] .wf-arrow{color:#a62d24}
.nav>.language-switch{margin-left:auto}
.nav>.cta+.language-switch{margin-left:0}
.mobile-menu .language-switch{margin:8px 0 4px;width:max-content;min-width:130px}
.mobile-menu ul a.language-switch{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:0 18px;border-bottom:1px solid #7778;font:750 13px/1 Arial,sans-serif;letter-spacing:.1em}
.travel-site .nav>.language-switch{margin-left:10px}
.travel-site .brand>img{display:block;width:125px!important;height:auto!important;max-height:none!important;object-fit:contain;flex:0 0 auto}
html[lang=en] .nav .nav-ko,html[lang=en] .mobile-menu .nav-ko{display:none}
html[lang=en] .hero .display-line em{margin-right:.3em}
@media(max-width:1200px){.nav .logo-img{width:140px!important}.nav ul{gap:16px!important}.nav>a.cta{min-width:184px;padding-right:39px!important;font-size:14px!important}.travel-site .nav>.language-switch{margin-left:0}}
@media(max-width:850px){.nav .logo-img{width:130px!important}.nav>.language-switch{margin-left:auto}.nav .burger{margin-left:0}.travel-site .brand>img{width:110px!important}}
/* Phones: the gate sign lives in the mobile menu; in the header it pushed the menu button off-screen. */
@media(max-width:600px){.nav>a.cta{display:none}.nav .logo-img{width:118px!important}.nav>.language-switch{font-size:10px;min-height:36px;padding:0 7px}.travel-site .nav>.language-switch{font-size:10px;padding:0 6px}.travel-site .brand>img{width:98px!important}.travel-site .brand span{font-size:8px!important}}
@media(max-width:360px){.nav{gap:12px}.nav .logo-img{width:108px!important}.nav>.language-switch{font-size:9px;padding:0 5px}.travel-site .brand>img{width:90px!important}.travel-site .brand span{display:none}}
/* Statutory business details, taken from the official www.jsbtour.com footer data. */
.biz-info{max-width:1280px;margin:34px auto 0;padding-top:18px;border-top:1px solid #222;color:#8b8b8b;font-size:11px;line-height:1.8;letter-spacing:0;overflow-wrap:anywhere}
.biz-info a{color:#b8b8b8;text-decoration:underline;text-underline-offset:3px;white-space:nowrap}
.travel-site .biz-info{max-width:none;margin:0;padding:16px 0;color:#8f8f88}
/* Language menu (six languages). Replaces the single EN / GLOBAL switch. */
.lang-menu{position:relative;flex:0 0 auto}
.lang-menu>summary{display:inline-flex;align-items:center;gap:7px;min-height:40px;padding:0 12px;border:1px solid #7778;border-radius:2px;color:#fff;font:750 11px/1 Arial,sans-serif;letter-spacing:.1em;white-space:nowrap;cursor:pointer;list-style:none;user-select:none;transition:background .2s,border-color .2s}
.lang-menu>summary::-webkit-details-marker{display:none}
.lang-menu>summary::before{content:'';width:13px;height:13px;border:1.5px solid currentColor;border-radius:50%;box-sizing:border-box;background:linear-gradient(currentColor,currentColor) 50%/1.5px 100% no-repeat,linear-gradient(currentColor,currentColor) 50%/100% 1.5px no-repeat;opacity:.85}
.lang-menu>summary::after{content:'▾';font-size:10px;opacity:.8}
.lang-menu>summary:hover,.lang-menu>summary:focus-visible,.lang-menu[open]>summary{background:#e83828;border-color:#e83828}
.lang-menu ul{position:absolute;right:0;top:calc(100% + 8px);z-index:80;min-width:172px;margin:0;padding:6px;list-style:none;background:#101010;border:1px solid #3a3a3a;border-radius:4px;box-shadow:0 14px 34px #000a}
.lang-menu li a{display:block;padding:10px 12px;border-radius:3px;color:#e9e9e9;font-size:14px;line-height:1.3;text-decoration:none;white-space:nowrap}
.lang-menu li a:hover,.lang-menu li a:focus-visible{background:#1f1f1f;color:#fff}
.lang-menu li a[aria-current]{color:#ff9c96}
.lang-menu li a[aria-current]::after{content:'  ✓'}
.nav>.lang-menu{margin-left:auto}
.nav>.cta+.lang-menu{margin-left:0}
.travel-site .nav>.lang-menu{margin-left:10px}
.mobile-menu li.lang-item{margin-top:10px}
.mobile-menu .lang-list{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.mobile-menu .lang-list li{margin:0;border:0}
.mobile-menu ul .lang-list a{display:inline-flex;align-items:center;min-height:40px;padding:0 13px;border:1px solid #7778;border-radius:2px;color:#fff;font:600 14px/1 Arial,sans-serif;letter-spacing:0}
.mobile-menu ul .lang-list a[aria-current]{background:#e83828;border-color:#e83828}
@media(max-width:1200px){.travel-site .nav>.lang-menu{margin-left:0}}
@media(max-width:850px){.nav>.lang-menu{margin-left:auto}}
@media(max-width:600px){.nav>.lang-menu>summary{min-height:36px;padding:0 9px;font-size:10px}.lang-menu ul{right:-6px}}
@media(max-width:360px){.nav>.lang-menu>summary{padding:0 7px;gap:5px}.nav>.lang-menu>summary::before{display:none}}
/* Chinese and Japanese: break lines between characters (keep-all is for Korean) and use CJK fonts. */
html[lang^=zh] *,html[lang=ja] *{word-break:normal!important;line-break:strict}
html[lang^=zh]{--font-sans:-apple-system,BlinkMacSystemFont,"PingFang SC","Hiragino Sans GB","Microsoft YaHei","Noto Sans SC",sans-serif;--font-display:"Helvetica Neue","PingFang SC","Microsoft YaHei","Noto Sans SC",sans-serif}
html[lang=ja]{--font-sans:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic","Meiryo","Noto Sans JP",sans-serif;--font-display:"Helvetica Neue","Hiragino Sans","Yu Gothic","Noto Sans JP",sans-serif}
/* The header's own nav styles (flex rows, small caps) must not reach the language list. */
.nav .lang-menu ul{display:block;gap:0}
.nav .lang-menu ul li{display:block;margin:0}
.nav .lang-menu ul a{display:block;flex-direction:initial;gap:0;font-size:14px;font-weight:500;letter-spacing:0;text-transform:none;line-height:1.3}
.mobile-menu ul.lang-list{display:flex!important;flex-direction:row!important;flex-wrap:wrap;gap:8px}
.mobile-menu ul.lang-list li{flex:0 0 auto;width:auto;border:0;padding:0}
.mobile-menu ul.lang-list a{text-transform:none;font-size:14px!important;padding:0 13px!important;justify-content:center}
/* The small English sub-label under each menu item only helps on Korean pages. */
html:not([lang=ko]) .nav .nav-ko,html:not([lang=ko]) .mobile-menu .nav-ko{display:none}
/* Travel-site header on tablets: one row must hold the logo, three links and the language menu in every language. */
@media(max-width:1000px){.travel-site .nav nav{gap:12px}.travel-site .nav nav .wf-icon,.travel-site .nav nav .wf-arrow{display:none}.travel-site .nav>.lang-menu>summary::before{display:none}}
@media(max-width:900px){.travel-site .nav nav a.corporate{display:none}}
/* Long translations: let the business-info link and the travel header links wrap on small phones. */
.biz-info a{white-space:normal}
@media(max-width:400px){.travel-site .nav nav{max-width:132px}.travel-site .nav nav a.wayfinding-link{white-space:normal;text-align:center;line-height:1.25}}
@media(max-width:360px){.travel-site .nav nav{max-width:112px}}
/* Japanese headings: character breaks with balanced lines (text-wrap:balance below). Phrase breaking (auto-phrase)
   force-split phrases longer than a line and left 1–2 characters on the last line (…ツ / アー). */
html[lang=ja] :is(h1,h2,h3,h4,.display-line,.hero-kicker){overflow-wrap:anywhere}
/* ---- Longer translated text (multilingual audit 2026-09-30) ---- */
/* Headings: even line lengths, no lone word or character on the last line; running text avoids a one-word
   last line where supported. All languages (Chrome/Edge 114+, Safari 17.5+, Firefox 121+; others ignore it). */
:is(h1,h2,h3,h4){text-wrap:balance}
.heading-line{display:block}  /* translated headings: one block per line of the Korean layout (see split_heading_lines) */
:is(p,li,dd,figcaption){text-wrap:pretty}
/* French/Spanish: the automatic hyphenation split headings, labels and place names (INTERNA-TIONAUX, Po-hang).
   Keep whole words; a word longer than its box still breaks instead of overflowing. */
html[lang=fr],html[lang=es]{-webkit-hyphens:manual;hyphens:manual}
/* Japanese keeps its own rule above (overflow-wrap:anywhere); with break-word a long phrase widened
   whole columns on phones. Latin scripts: a word longer than its line breaks instead of widening the page. */
html:is([lang=en],[lang=fr],[lang=es],[lang^=zh]) :is(h1,h2,h3,h4,h5,.eyebrow,.btn,button,summary,label,th,dt){overflow-wrap:anywhere}
/* Airport board: translated durations and "view itinerary" labels are 2–3× the Korean length, so each row
   shows the region with the status label on the right and the duration underneath. */
html:not([lang=ko]) .route-product-buttons button{grid-template-columns:34px minmax(0,1fr) 88px;grid-template-areas:"no dest sel" ". dur sel";row-gap:1px;padding-top:9px;padding-bottom:9px}
html:not([lang=ko]) .route-product-buttons button .route-program{grid-area:no;align-self:start}
html:not([lang=ko]) .route-product-buttons button .route-destination{grid-area:dest;line-height:1.35}
html:not([lang=ko]) .route-product-buttons button .route-duration{grid-area:dur;white-space:normal;font-size:12.5px;line-height:1.35;opacity:.85}
html:not([lang=ko]) .route-product-buttons button .route-selection{grid-area:sel;white-space:normal;font-size:12.5px;line-height:1.25;padding:4px 3px}
html:not([lang=ko]) .route-board-labels{grid-template-columns:34px minmax(0,1fr) 88px}
html:not([lang=ko]) .route-board-labels>span:nth-child(3){display:none}
html:not([lang=ko]) .route-board-labels>span{white-space:nowrap}
/* Stop list: "Transfert", "Traslado", "Transfer" need a wider type column than 이동 / 방문. */
html:is([lang=en],[lang=fr],[lang=es]) :is(.route-stop-labels,.route-node){grid-template-columns:28px minmax(0,1fr) 68px}
/* Two route links side by side are too narrow for translated text (the board is ~430px even on desktop): stack them. */
html:not([lang=ko]) .route-links{flex-direction:column;align-items:flex-start;gap:0}
/* Travel filters: wrap whole chips to a new row instead of squeezing their text into three lines. */
html:not([lang=ko]) .filters{flex-wrap:wrap}
html:not([lang=ko]) .filters button{white-space:nowrap}
/* Travel hero on phones: the translated heading and text are taller, so keep the photo caption (HELLO, BUSAN)
   below them instead of under the button. */
@media(max-width:760px){html:not([lang=ko]) .travel-hero .hero-copy{padding-bottom:230px}}
/* Page titles on the smallest phones: long Latin words (confidentialité) fit whole instead of breaking. */
@media(max-width:360px){html:is([lang=en],[lang=fr],[lang=es]) .page-head h1{font-size:31px!important}}