/* =========================================================================
   eVersum — internationalisation layer (EN / JA)
   -------------------------------------------------------------------------
   Two jobs only:
     1. the header language switcher (matches the existing header-contacts
        style: uppercase micro-type, white on dark, cyan accent #35bfef)
     2. Japanese typography adjustments, scoped to :lang(ja) / .ev-lang-ja
        so the English site is byte-for-byte visually unchanged.
   No colours, dimensions or animations of existing components are touched.
   ========================================================================= */

/* ------------------------------------------------------------------ 1 */
.ev-lang-switch {
	float: right;
	position: relative;
	top: 24px;
	right: 150px;
	padding-right: 30px;
	z-index: 30;
}
.ev-lang-switch ul {
	display: flex;
	align-items: center;
	float: right;
	margin: 0;
	padding: 0;
	list-style: none;
}
.ev-lang-switch li {
	list-style: none;
	margin: 0;
	position: relative;
	top: 14px;
}
.ev-lang-switch li + li:before {
	content: '';
	position: absolute;
	left: 0;
	top: 50%;
	width: 1px;
	height: 10px;
	margin-top: -5px;
	background: rgba(255, 255, 255, 0.28);
}
.ev-lang-switch__item {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 20px;
	padding: 0 12px;
	line-height: 1;
	font-size: 10px;
	font-weight: 500;
	letter-spacing: 3px;
	text-transform: uppercase;
	text-decoration: none;
	color: rgba(255, 255, 255, 0.51);
	transition: color 0.3s ease;
}
a.ev-lang-switch__item:hover,
a.ev-lang-switch__item:focus-visible {
	color: #35bfef;
}
.ev-lang-switch__item.is-current {
	color: #fff;
}
.ev-lang-switch__item[lang="ja"] {
	letter-spacing: 1px;
}

@media only screen and (max-width: 1064px) {
	.ev-lang-switch {
		right: 90px;
		padding-right: 15px;
	}
}
@media only screen and (max-width: 768px) {
	/* keep clear of the burger menu button */
	.ev-lang-switch {
		right: 130px;
		top: 18px;
		padding-right: 0;
	}
	.ev-lang-switch__item {
		padding: 0 8px;
		letter-spacing: 2px;
	}
}
@media only screen and (max-width: 480px) {
	.ev-lang-switch {
		right: 108px;
	}
	.ev-lang-switch__item {
		padding: 0 6px;
		letter-spacing: 1px;
	}
}

/* ------------------------------------------------------------------ 2 */
/* Japanese typography. Applied only on /ja/ pages. Noto Sans JP is loaded
   at runtime by js/ev-i18n.js so English visitors never download it.       */
html.ev-lang-ja body,
html.ev-lang-ja input,
html.ev-lang-ja textarea,
html.ev-lang-ja select,
html.ev-lang-ja button {
	font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic",
		Meiryo, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

/* Japanese glyphs are visually larger and need more leading; headings that
   were tuned for wide Latin tracking must lose their letter-spacing.       */
html.ev-lang-ja h1,
html.ev-lang-ja h2,
html.ev-lang-ja h3,
html.ev-lang-ja h4,
html.ev-lang-ja h5,
html.ev-lang-ja h6 {
	letter-spacing: 0.02em;
	line-height: 1.45;
	word-break: normal;
	overflow-wrap: anywhere;
	line-break: strict;
}
html.ev-lang-ja p,
html.ev-lang-ja li,
html.ev-lang-ja td,
html.ev-lang-ja th,
html.ev-lang-ja dd,
html.ev-lang-ja dt {
	line-height: 1.9;
	letter-spacing: 0.01em;
	word-break: normal;
	overflow-wrap: anywhere;
	line-break: strict;
}

/* Uppercase transforms and wide tracking are meaningless in Japanese and
   break kana rendering — neutralise them for JA text only.                 */
html.ev-lang-ja .section-title,
html.ev-lang-ja .subtitle,
html.ev-lang-ja .horizonral-subtitle,
html.ev-lang-ja .btn,
html.ev-lang-ja .menu-button-text,
html.ev-lang-ja .nav-holder nav li a,
html.ev-lang-ja .tabs-menu li a,
html.ev-lang-ja .ev-lang-switch__item {
	text-transform: none;
}
html.ev-lang-ja .subtitle,
html.ev-lang-ja .horizonral-subtitle span,
html.ev-lang-ja .btn {
	letter-spacing: 0.06em;
}

/* Vertical stacked side titles cannot render Japanese legibly when rotated
   with Latin metrics — keep them upright.                                  */
html.ev-lang-ja .horizonral-subtitle span {
	writing-mode: vertical-rl;
	transform: none;
	text-orientation: upright;
}

/* Buttons and labels grow ~15% with Japanese copy: allow wrapping instead
   of clipping, without changing any declared width or colour.              */
html.ev-lang-ja .btn,
html.ev-lang-ja .tabs-menu li a,
html.ev-lang-ja .header-contacts li {
	white-space: normal;
}

/* Some hero/section headings carry Latin tracking from more specific rules;
   these overrides keep Japanese headings tight and in mixed case.           */
html.ev-lang-ja .hero-title .section-title h2,
html.ev-lang-ja .section-title h2,
html.ev-lang-ja .section-title h3,
html.ev-lang-ja .accordion a.toggle,
html.ev-lang-ja .pr-list li span,
html.ev-lang-ja .box-item h3 {
	letter-spacing: 0.02em;
	text-transform: none;
	word-spacing: normal;
}
html.ev-lang-ja .hero-title .section-title h2 {
	line-height: 1.5;
}

/* Latin brand names must keep their official casing on Japanese pages, where
   the decorative uppercase transform would render eShuttle as E-SHUTTLE.    */
html.ev-lang-ja h1,
html.ev-lang-ja h2,
html.ev-lang-ja h3,
html.ev-lang-ja h4,
html.ev-lang-ja .content-nav a span,
html.ev-lang-ja .parallax-header span,
html.ev-lang-ja .fw-separator span,
html.ev-lang-ja .breadcrumbs a,
html.ev-lang-ja .breadcrumbs span {
	text-transform: none;
}

/* Latin postal addresses and e-mail lines stay in their written casing on the
   Japanese pages, where forced uppercase reads as shouting.                  */
html.ev-lang-ja .contact-details li,
html.ev-lang-ja .contact-details span,
html.ev-lang-ja .ev-contact-block,
html.ev-lang-ja .ev-contact-block * {
	text-transform: none;
}