/* English typography and layout fixes */

html[lang^="en"] {
	--en-text-xs: clamp(0.75rem, 0.7rem + 0.22vw, 0.875rem);
	--en-text-sm: clamp(0.8125rem, 0.76rem + 0.28vw, 1rem);
	--en-text-md: clamp(0.9375rem, 0.84rem + 0.4vw, 1.125rem);
	--en-text-lg: clamp(1.0625rem, 0.92rem + 0.55vw, 1.375rem);
	--en-text-xl: clamp(1.25rem, 1.02rem + 0.9vw, 1.875rem);
	--en-text-2xl: clamp(1.5rem, 1.15rem + 1.4vw, 2.5rem);
	--en-text-3xl: clamp(1.75rem, 1.25rem + 2vw, 3.375rem);
}

/* ── Homepage ─────────────────────────────────────────────── */

html[lang^="en"] .page-home .title-home {
	max-width: min(calc(100% - 2rem), 56rem);
	margin: 0 auto;
	padding: 0 0.75rem;
}

html[lang^="en"] .page-home .title-top-home h2,
html[lang^="en"] .page-home .title-top-home span {
	font-size: var(--en-text-lg);
	line-height: 1.35;
	letter-spacing: 0.06em;
	word-break: break-word;
}

html[lang^="en"] .page-home .title-bottom-home h1 {
	font-size: var(--en-text-2xl);
	line-height: 1.25;
	letter-spacing: 0.08em;
	padding: clamp(0.75rem, 2vw, 2.625rem) 0.75rem 0.5rem;
	word-break: break-word;
}

html[lang^="en"] .page-home .title-bottom-home span {
	display: block;
	font-size: var(--en-text-xl);
	line-height: 1.3;
	letter-spacing: 0.06em;
	word-break: break-word;
}

html[lang^="en"] .page-home .title-col-abouthome,
html[lang^="en"] .page-home .title-about-home-bottom {
	font-size: var(--en-text-2xl);
	line-height: 1.25;
	margin-bottom: clamp(1rem, 2.5vw, 3rem);
	word-break: break-word;
}

html[lang^="en"] .page-home .wrap-title-about-bottom h2 {
	font-size: var(--en-text-lg);
	line-height: 1.3;
	word-break: break-word;
}

html[lang^="en"] .page-home .rst-box-about-bottom p {
	font-size: var(--en-text-md);
	line-height: 1.6;
	letter-spacing: 0;
	word-break: break-word;
}

html[lang^="en"] .page-home .title-why-plus h2 {
	font-size: var(--en-text-2xl);
	line-height: 1.2;
	max-width: min(100%, 40rem);
	margin-left: auto;
	margin-right: auto;
	padding: 0 1rem;
	word-break: break-word;
}

html[lang^="en"] .page-home .title-why-plus p {
	font-size: var(--en-text-md);
	line-height: 1.55;
	padding: 0 1rem;
	word-break: break-word;
}

html[lang^="en"] .page-home .r-item-box-plus h2 {
	font-size: var(--en-text-xl);
	line-height: 1.3;
	margin-bottom: 0.75rem;
	word-break: break-word;
}

html[lang^="en"] .page-home .r-item-box-plus p,
html[lang^="en"] .page-home .content-box-plus,
html[lang^="en"] .page-home .content-box-plus p,
html[lang^="en"] .page-home .content-box-plus li {
	font-size: var(--en-text-md) !important;
	line-height: 1.6 !important;
	letter-spacing: 0 !important;
	word-break: break-word;
	text-indent: 0 !important;
}

html[lang^="en"] .page-home .r-item-box-plus h3 {
	font-size: var(--en-text-md);
	line-height: 1.35;
	margin-bottom: 0.5rem;
	word-break: break-word;
}

html[lang^="en"] .page-home .box-plus .container-plus {
	padding-left: clamp(0.75rem, 3vw, 1.5rem);
	padding-right: clamp(0.75rem, 3vw, 1.5rem);
	box-sizing: border-box;
}

html[lang^="en"] .page-home .r-item-box-plus {
	max-width: 100%;
	box-sizing: border-box;
}

html[lang^="en"] .page-home .contact-home h2 {
	font-size: var(--en-text-3xl);
	line-height: 1.15;
	letter-spacing: 0.08em;
	padding: 0 1rem;
}

html[lang^="en"] .page-home .contact-home h3 {
	font-size: var(--en-text-xl);
	line-height: 1.3;
	padding: 0 1rem;
	word-break: break-word;
}

html[lang^="en"] .page-home .contact-home p {
	font-size: var(--en-text-md);
	line-height: 1.55;
	padding: 0 1.25rem;
	max-width: 45rem;
	word-break: break-word;
}

html[lang^="en"] .page-home .about-home-top .container,
html[lang^="en"] .page-home .container-about-home {
	padding-left: clamp(0.75rem, 3vw, 1.5rem);
	padding-right: clamp(0.75rem, 3vw, 1.5rem);
}

html[lang^="en"] .page-home .list-about-home,
html[lang^="en"] .page-home .title-col-abouthome {
	position: relative;
	z-index: 1;
}

/* Desktop/tablet: label + value columns aligned like JP */
html[lang^="en"] .page-home .list-about-home ul li {
	display: grid;
	grid-template-columns: 10.5rem minmax(0, 1fr);
	column-gap: clamp(1.25rem, 2.5vw, 3.4375rem);
	row-gap: 0.25rem;
	align-items: start;
	margin-bottom: 2.5rem;
}

html[lang^="en"] .page-home .list-about-home ul li span {
	min-width: 0;
	max-width: none;
	width: auto;
	font-size: clamp(0.9375rem, 0.84rem + 0.4vw, 1.375rem) !important;
	line-height: 1.35 !important;
}

html[lang^="en"] .page-home .list-about-home ul li .content-about-home {
	max-width: none;
	width: auto;
	font-size: clamp(0.9375rem, 0.84rem + 0.4vw, 1.5rem) !important;
	line-height: 1.5 !important;
}

html[lang^="en"] .page-home .list-about-home ul li .content-about-home p,
html[lang^="en"] .page-home .list-about-home ul li .content-about-home ul {
	margin-bottom: 0;
}

html[lang^="en"] .page-home .list-about-home ul li .content-about-home ul {
	padding-left: 1.25rem;
}

@media (max-width: 1024px) {
	html[lang^="en"] .page-home .container-about {
		flex-direction: column;
		gap: 2rem;
		padding-top: 2.5rem;
	}

	html[lang^="en"] .page-home .col-abouthome {
		width: 100%;
	}

	html[lang^="en"] .page-home .about-home-bottom {
		gap: 1.5rem;
	}

	html[lang^="en"] .page-home .rst-box-about-bottom {
		max-width: 100%;
	}
}

@media (max-width: 991px) {
	html[lang^="en"] .page-home .about-home::after {
		display: none;
	}

	html[lang^="en"] .page-home .scroll-home {
		display: none;
	}

	html[lang^="en"] .page-home .about-home-top {
		padding-bottom: 1.5rem !important;
		padding-left: 0 !important;
	}

	html[lang^="en"] .page-home .list-about-home ul li {
		display: flex;
		flex-direction: column;
		align-items: flex-start;
		gap: 0.5rem;
		margin-bottom: 1.25rem;
	}

	html[lang^="en"] .page-home .list-about-home ul li span {
		min-width: 0;
		max-width: 100%;
		width: 100%;
		font-size: var(--en-text-md) !important;
		line-height: 1.35 !important;
	}

	html[lang^="en"] .page-home .list-about-home ul li .content-about-home {
		max-width: 100%;
		width: 100%;
		font-size: var(--en-text-sm) !important;
		line-height: 1.5 !important;
		word-break: break-word;
	}

	html[lang^="en"] .page-home .contact-home {
		padding: 4rem 0 3rem;
	}
}

@media (max-width: 768px) {
	html[lang^="en"] .page-home .title-home {
		max-width: calc(100% - 1.5rem);
	}

	html[lang^="en"] .page-home .about-home {
		padding-top: 2rem;
		padding-bottom: 3rem;
	}

	html[lang^="en"] .page-home .why-plus::before {
		width: min(100%, 24rem);
		opacity: 0.35;
	}

	html[lang^="en"] .page-home .about-home-bottom {
		flex-direction: column;
	}

	html[lang^="en"] .page-home .l-item-box-plus img {
		padding: 0 1.5rem;
	}

	html[lang^="en"] .page-home .box-plus .container-plus {
		gap: 1.25rem !important;
	}
}

@media (max-width: 576px) {
	html[lang^="en"] .page-home .banner-home video {
		height: auto;
		min-height: 24rem;
		max-height: 70vh;
		object-fit: cover;
	}

	html[lang^="en"] .page-home .title-bottom-home {
		padding-bottom: 1rem;
	}

	html[lang^="en"] .page-home .title-col-abouthome,
	html[lang^="en"] .page-home .title-about-home-bottom,
	html[lang^="en"] .page-home .title-why-plus h2 {
		font-size: var(--en-text-xl);
	}

	html[lang^="en"] .page-home .contact-home h2 {
		font-size: var(--en-text-2xl);
	}

	html[lang^="en"] .page-home .contact-home h3 {
		font-size: var(--en-text-lg);
	}

	html[lang^="en"] .page-home .contact-home p {
		font-size: var(--en-text-sm);
	}
}

/* ── Services page ────────────────────────────────────────── */

html[lang^="en"] .page-serivice .banner-serivice h1 {
	font-size: var(--en-text-2xl);
	line-height: 1.2;
	letter-spacing: 0.06em;
	word-break: break-word;
	padding: 0 1rem;
}

html[lang^="en"] .page-serivice .title-serivice h2 {
	font-size: var(--en-text-2xl);
	line-height: 1.25;
	margin-bottom: clamp(0.5rem, 2vw, 1.2rem);
	word-break: break-word;
	padding: 0 1rem;
}

html[lang^="en"] .page-serivice .title-serivice p {
	font-size: var(--en-text-lg);
	line-height: 1.35;
	letter-spacing: 0.08em;
	word-break: break-word;
	padding: 0 1rem;
}

html[lang^="en"] .page-serivice .list-tap-serivice {
	gap: clamp(0.5rem, 3vw, 5.75rem);
	flex-wrap: wrap;
	padding: 0 clamp(0.75rem, 3vw, 1.5rem);
	align-items: flex-end;
}

html[lang^="en"] .page-serivice .wrap-tap {
	width: clamp(9.5rem, 44vw, 25rem);
	max-width: min(25rem, calc(50% - 0.5rem));
	flex: 1 1 clamp(9.5rem, 44vw, 25rem);
	padding: clamp(2rem, 7vw, 5.2rem) clamp(0.5rem, 2vw, 1rem) clamp(0.75rem, 2vw, 1.2rem);
	background-size: 100% auto;
	box-sizing: border-box;
}

html[lang^="en"] .page-serivice .list-tap-serivice a {
	font-size: clamp(0.6875rem, 0.5rem + 1vw, 1.125rem) !important;
	line-height: 1.25 !important;
	letter-spacing: 0 !important;
	word-break: break-word;
	hyphens: auto;
	max-width: 92%;
	padding: 0 0.35rem;
	box-sizing: border-box;
}

html[lang^="en"] .page-serivice .title-wrap-list-serivice h2 {
	font-size: var(--en-text-xl);
	line-height: 1.25;
	padding: clamp(1.5rem, 4vw, 4.5rem) 1rem clamp(1rem, 3vw, 2.7rem);
	word-break: break-word;
}

html[lang^="en"] .page-serivice .content-box-serivice h3 {
	font-size: var(--en-text-lg) !important;
	line-height: 1.3 !important;
	margin-bottom: 0.75rem;
	word-break: break-word;
}

html[lang^="en"] .page-serivice .content-box-serivice ul li {
	font-size: var(--en-text-md) !important;
	line-height: 1.55 !important;
	text-indent: 0 !important;
	margin-left: 0;
	padding-left: 1rem;
	word-break: break-word;
}

html[lang^="en"] .page-serivice .title-contract,
html[lang^="en"] .page-serivice .title-content-technology,
html[lang^="en"] .page-serivice .development-services h2,
html[lang^="en"] .page-serivice .title-development-services h2,
html[lang^="en"] .page-serivice .l-list-course h2 {
	font-size: var(--en-text-2xl);
	line-height: 1.25;
	word-break: break-word;
}

html[lang^="en"] .page-serivice .box-contract h3 {
	font-size: var(--en-text-xl);
	line-height: 1.3;
	word-break: break-word;
}

html[lang^="en"] .page-serivice .content-contr,
html[lang^="en"] .page-serivice .content-contr p {
	font-size: var(--en-text-md) !important;
	line-height: 1.6 !important;
	letter-spacing: 0 !important;
	word-break: break-word;
}

html[lang^="en"] .page-serivice .cont-development-services h3,
html[lang^="en"] .page-serivice .inner-course h3 {
	font-size: var(--en-text-xl) !important;
	line-height: 1.3 !important;
	padding: 0;
	word-break: break-word;
}

html[lang^="en"] .page-serivice .cont-development-services p,
html[lang^="en"] .page-serivice .inner-course p,
html[lang^="en"] .page-serivice .inner-course ul li {
	font-size: var(--en-text-md) !important;
	line-height: 1.6 !important;
	text-indent: 0 !important;
	letter-spacing: 0 !important;
	word-break: break-word;
}

html[lang^="en"] .page-serivice .inner-box-serivice ul li span {
	font-size: var(--en-text-md) !important;
	line-height: 1.4 !important;
	word-break: break-word;
}

html[lang^="en"] .page-serivice .l-box-serivice-top {
	width: clamp(4.5rem, 6vw, 5rem);
}

html[lang^="en"] .page-serivice .l-box-serivice-top h3 {
	font-size: clamp(0.75rem, 0.65rem + 0.45vw, 1.125rem) !important;
	line-height: 1.2 !important;
	left: 50%;
	width: 90%;
	text-align: center;
	word-break: break-word;
}

html[lang^="en"] .page-serivice .contact-home h2 {
	font-size: var(--en-text-3xl);
	line-height: 1.15;
	letter-spacing: 0.08em;
	padding: 0 1rem;
}

html[lang^="en"] .page-serivice .contact-home h3 {
	font-size: var(--en-text-xl);
	line-height: 1.3;
	padding: 0 1rem;
	word-break: break-word;
}

html[lang^="en"] .page-serivice .contact-home p {
	font-size: var(--en-text-md);
	line-height: 1.55;
	padding: 0 1.25rem;
	max-width: 45rem;
	word-break: break-word;
}

@media (max-width: 1024px) {
	html[lang^="en"] .page-serivice .p-r-40 {
		padding-left: clamp(1rem, 5vw, 8rem);
		padding-right: 1rem;
	}

	html[lang^="en"] .page-serivice .box-contract h3::after {
		width: min(100%, 40rem);
		left: calc(-1 * clamp(1rem, 5vw, 8rem));
		background-size: contain;
	}

	html[lang^="en"] .page-serivice .content-contr {
		padding-left: clamp(1rem, 3vw, 3rem);
		padding-right: 1rem;
		max-width: 100%;
	}

	html[lang^="en"] .page-serivice .list-course-0,
	html[lang^="en"] .page-serivice .list-course-1 {
		padding-left: 1rem;
		padding-right: 1rem;
	}
}

@media (max-width: 991px) {
	html[lang^="en"] .page-serivice .wrap-tap {
		max-width: calc(50% - 0.35rem);
	}
}

@media (max-width: 768px) {
	html[lang^="en"] .page-serivice .list-tap-serivice a {
		font-size: clamp(0.625rem, 2.6vw, 0.8125rem) !important;
	}

	html[lang^="en"] .page-serivice .wrap-tap {
		padding-top: clamp(1.75rem, 8vw, 3.75rem);
	}

	html[lang^="en"] .page-serivice .cont-development-services p,
	html[lang^="en"] .page-serivice .inner-course ul {
		margin-left: 0 !important;
	}

	html[lang^="en"] .page-serivice .inner-development-services {
		padding: 0 1rem;
	}

	html[lang^="en"] .page-serivice .box-list-serivice {
		border-radius: 0;
		padding-bottom: 3rem;
	}

	html[lang^="en"] .page-serivice .content-box-serivice {
		padding: clamp(1rem, 3vw, 1.375rem);
	}
}

@media (max-width: 576px) {
	html[lang^="en"] .page-serivice .wrap-tap {
		width: calc(50% - 0.25rem);
		flex-basis: calc(50% - 0.25rem);
		max-width: calc(50% - 0.25rem);
	}

	html[lang^="en"] .page-serivice .list-tap-serivice {
		gap: 0.5rem;
	}

	html[lang^="en"] .page-serivice .title-serivice h2,
	html[lang^="en"] .page-serivice .title-contract,
	html[lang^="en"] .page-serivice .title-content-technology,
	html[lang^="en"] .page-serivice .development-services h2,
	html[lang^="en"] .page-serivice .l-list-course h2 {
		font-size: var(--en-text-xl);
	}

	html[lang^="en"] .page-serivice .box-contract h3,
	html[lang^="en"] .page-serivice .cont-development-services h3,
	html[lang^="en"] .page-serivice .inner-course h3 {
		font-size: var(--en-text-lg) !important;
	}

	html[lang^="en"] .page-serivice .content-box-serivice h3 {
		font-size: var(--en-text-md) !important;
	}

	html[lang^="en"] .page-serivice .content-box-serivice ul li,
	html[lang^="en"] .page-serivice .content-contr,
	html[lang^="en"] .page-serivice .cont-development-services p,
	html[lang^="en"] .page-serivice .inner-course ul li {
		font-size: var(--en-text-sm) !important;
	}

	html[lang^="en"] .page-serivice .p-r-40 {
		padding-left: 1rem;
	}

	html[lang^="en"] .page-serivice .contact-home h2 {
		font-size: var(--en-text-2xl);
	}

	html[lang^="en"] .page-serivice .contact-home h3 {
		font-size: var(--en-text-lg);
	}

	html[lang^="en"] .page-serivice .contact-home p {
		font-size: var(--en-text-sm);
	}
}
