:root {
		--brand: #1A56DB;
		--brand-deep: #0E3F9E;
		--brand-light: #E8F0FE;
		--brand-soft: #F5F8FF;
		--ink: #0F1B3D;
		--ink-2: #3A4A6B;
		--ink-3: #6B7A99;
		--line: #E4EAF5;
		--line-strong: #C8D3E8;
		--bg: #FFFFFF;
		--bg-soft: #F7F9FE;
		--warn: #E67700;
		--success: #0E8F5E;
		--radius: 12px;
		--shadow-card: 0 1px 3px rgba(15, 27, 61, .06);
		--shadow-sm: 0 1px 3px rgba(15, 27, 61, .06);
		--shadow: 0 12px 32px rgba(15, 27, 61, .10);
	}

	* {
		box-sizing: border-box;
		margin: 0;
		padding: 0
	}

	html,
	body {
		font-family: "PingFang SC", "Microsoft YaHei", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
		color: var(--ink);
		background: var(--bg);
		font-size: 14px;
		line-height: 1.7;
		-webkit-font-smoothing: antialiased
	}

	a {
		color: inherit;
		text-decoration: none !important;
		outline: none !important;
	}


	img {
		max-width: 100%;
		display: block
	}

	.container {
		max-width: 1180px;
		margin: 0 auto;
		padding: 0 24px
	}

	.eyebrow {
		display: inline-flex;
		align-items: center;
		gap: 6px;
		color: var(--brand);
		font-size: 12px;
		font-weight: 500;
		letter-spacing: .5px;
		text-transform: uppercase;
		background: rgba(232, 240, 254, 0.36);
		padding: 7px 18px;
		border-radius: 22px
	}

	.eyebrow::before {
		content: "";
		width: 3px;
		height: 3px;
		border-radius: 50%;
		background: var(--brand)
	}

	.eyebrow-front-grid::before {
		width: 3px;
		height: 3px;
		border-radius: 50%;
		background: var(--brand)
	}

	h1,
	h2,
	h3,
	h4 {
		color: var(--ink);
		font-weight: 600;
		letter-spacing: -.2px
	}

	h2 {
		font-size: 34px;
		line-height: 1.3;
		margin-bottom: 14px
	}

	h3 {
		font-size: 20px;
		line-height: 1.4;
		margin-bottom: 8px
	}

	.lede {
		color: #797f8b;
		font-size: 14px;
		max-width: 760px
	}

	/* ====== NAV ====== */
	.nav {
		position: sticky;
		top: 0;
		z-index: 50;
		background: rgba(255, 255, 255, .92);
		backdrop-filter: blur(12px);
		border-bottom: 1px solid var(--line)
	}

	.nav-inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		height: 64px
	}

	.logo {
		display: flex;
		align-items: center;
		gap: 10px;
		font-weight: 600;
		font-size: 17px;
		color: var(--ink)
	}

	.logo-mark {
		width: 32px;
		height: 32px;
		background: linear-gradient(135deg, var(--brand) 0%, #4C7DE8 100%);
		border-radius: 8px;
		display: grid;
		place-items: center;
		color: #fff;
		font-weight: 600;
		font-size: 14px;
		letter-spacing: .5px
	}

	.nav-links {
		display: flex;
		gap: 6px;
		list-style: none
	}

	.nav-links a {
		padding: 8px 12px;
		border-radius: 6px;
		font-size: 13px;
		color: var(--ink-2);
		font-weight: 500
	}

	.nav-links a:hover {
		color: var(--brand);
		background: var(--brand-soft)
	}

	.nav-cta {
		background: var(--brand);
		color: #fff;
		padding: 9px 18px;
		border-radius: 8px;
		font-size: 13px;
		font-weight: 500;
		border: none;
		cursor: pointer;
		transition: all .2s
	}

	.nav-cta:hover {
		background: var(--brand-deep)
	}

	/* ====== HERO ====== */
	.hero {
		position: relative;
		overflow: hidden;
		min-height: 800px;
		display: flex;
		align-items: center
	}

	.hero-bg {
		position: absolute;
		inset: 0;
		background-position: center;
		background-size: cover;
		background-repeat: no-repeat;
		opacity: 0;
		transition: opacity 1.2s ease;
		z-index: 0
	}

	.hero-bg.active {
		opacity: 1
	}

	.hero-nav {
		position: absolute;
		top: 50%;
		transform: translateY(-50%);
		z-index: 2;
		width: 40px;
		height: 40px;
		border-radius: 50%;
		border: none;
		background: rgba(255, 255, 255, .35);
		color: var(--brand-deep);
		display: flex;
		align-items: center;
		justify-content: center;
		cursor: pointer;
		opacity: .45;
		transition: all .2s;
		backdrop-filter: blur(4px)
	}

	.hero-nav:hover {
		opacity: 1;
		background: rgba(255, 255, 255, .65)
	}

	.hero-nav svg {
		width: 20px;
		height: 20px
	}

	.hero-nav.prev {
		left: 26px
	}

	.hero-nav.next {
		right: 26px
	}

	.hero-inner {
		position: relative;
		display: grid;
		grid-template-columns: 1fr;
		gap: 60px;
		align-items: center;
		width: 100%;
		z-index: 1
	}

	.hero h1 {
		font-size: 52px;
		line-height: 1.18;
		font-weight: 700;
		margin-bottom: 18px;
		letter-spacing: -.5px
	}

	.hero h1 .accent {
		color: var(--brand);
		position: relative;
		display: inline-block
	}

	.hero .lede {
		font-size: 14px;
		margin-bottom: 32px;
		max-width: 640px
	}

	.hero-cta {
		display: flex;
		flex-direction: column;
		gap: 26px
	}

	.hero-btns {
		display: flex;
		gap: 14px;
		flex-wrap: wrap
	}

	.hero-creds {
		display: flex;
		align-items: stretch;
		gap: 28px;
		position: relative;
		padding-top: 26px
	}

	.hero-creds::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		width: 33.33%;
		height: 1px;
		background: var(--line)
	}

	.cred {
		display: flex;
		flex-direction: column;
		justify-content: center
	}

	.cred-lab {
		font-size: 13px;
		color: #575757;
		margin-bottom: 4px
	}

	.cred-val {
		font-size: 18px;
		font-weight: 700;
		color: var(--ink);
		letter-spacing: .3px
	}

	.cred-code {
		font-size: 14px;
		font-weight: 500;
		color: var(--ink-2)
	}

	.cred-divider {
		width: 1px;
		background: var(--line-strong)
	}

	.btn-primary,
	.btn-ghost {
		padding: 10px 20px;
		border-radius: 8px;
		font-size: 14px;
		font-weight: 500;
		cursor: pointer;
		border: 1px solid transparent;
		transition: all .2s;
		font-family: inherit
	}

	.btn-primary {
		background: var(--brand);
		color: #fff
	}

	.btn-primary:hover {
		background: var(--brand-deep);
		transform: translateY(-1px)
	}

	.btn-ghost {
		background: transparent;
		color: var(--brand);
		border-color: var(--brand)
	}

	.btn-ghost:hover {
		background: var(--brand-soft)
	}

	.hero-visual {
		position: relative;
		background: linear-gradient(135deg, #0E3F9E 0%, #1A56DB 100%);
		border-radius: 20px;
		padding: 32px;
		color: #fff;
		min-height: 400px;
		display: none;
		flex-direction: column;
		justify-content: center;
		box-shadow: 0 20px 50px rgba(26, 86, 219, .18)
	}

	.hero-visual::before {
		content: "";
		position: absolute;
		top: -20px;
		right: -20px;
		width: 120px;
		height: 120px;
		border-radius: 50%;
		background: rgba(255, 255, 255, .08)
	}

	.hero-visual::after {
		content: "";
		position: absolute;
		bottom: 40px;
		right: 30px;
		width: 60px;
		height: 60px;
		border-radius: 50%;
		background: rgba(255, 255, 255, .05)
	}

	.hv-tag {
		display: inline-block;
		background: rgba(255, 255, 255, .18);
		padding: 4px 12px;
		border-radius: 20px;
		font-size: 12px;
		margin-bottom: 18px
	}

	.hero-visual h3 {
		color: #fff;
		font-size: 24px;
		margin-bottom: 12px
	}

	.hero-visual p {
		color: rgba(255, 255, 255, .85);
		font-size: 14px;
		margin-bottom: 24px
	}

	.hv-stat {
		display: flex;
		justify-content: space-between;
		padding: 14px 0;
		border-top: 1px solid rgba(255, 255, 255, .15)
	}

	.hv-stat:last-child {
		border-bottom: 1px solid rgba(255, 255, 255, .15)
	}

	.hv-stat .v {
		font-size: 22px;
		font-weight: 600
	}

	.hv-stat .k {
		font-size: 12px;
		color: rgba(255, 255, 255, .7)
	}

	/* ====== SECTION BASE ====== */
	section {
		padding: 90px 0
	}

	.section-head {
		text-align: center;
		max-width: 760px;
		margin: 0 auto 56px
	}

	.section-head .eyebrow {
		margin-bottom: 8px;
		padding: 4px 10px 2px;
		border: 1px solid #c9dcfc;
		border-radius: 8px;
		color: #4169bf
	}

	.section-head .eyebrow::before {
		width: 9px;
		height: 9px;
		border-radius: 0;
		background: var(--brand);
		opacity: .55
	}

	#about .section-head .eyebrow::before {
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='2' width='16' height='20' rx='2'/%3E%3Cpath d='M9 22v-4h6v4'/%3E%3Cpath d='M8 6h.01M16 6h.01M12 6h.01M12 10h.01M12 14h.01'/%3E%3C/svg%3E") center/contain no-repeat;
		mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='4' y='2' width='16' height='20' rx='2'/%3E%3Cpath d='M9 22v-4h6v4'/%3E%3Cpath d='M8 6h.01M16 6h.01M12 6h.01M12 10h.01M12 14h.01'/%3E%3C/svg%3E") center/contain no-repeat
	}

	#jobs .section-head .eyebrow::before {
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 20V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16'/%3E%3Crect x='2' y='6' width='20' height='14' rx='2'/%3E%3C/svg%3E") center/contain no-repeat;
		mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M16 20V4a2 2 0 0 0-2-2h-4a2 2 0 0 0-2 2v16'/%3E%3Crect x='2' y='6' width='20' height='14' rx='2'/%3E%3C/svg%3E") center/contain no-repeat
	}

	#growth .section-head .eyebrow::before {
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='22 7 13.5 15.5 8.5 10.5 2 17'/%3E%3Cpolyline points='16 7 22 7 22 13'/%3E%3C/svg%3E") center/contain no-repeat;
		mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='22 7 13.5 15.5 8.5 10.5 2 17'/%3E%3Cpolyline points='16 7 22 7 22 13'/%3E%3C/svg%3E") center/contain no-repeat
	}

	#benefits .section-head .eyebrow::before {
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='4' rx='1'/%3E%3Cpath d='M12 8v13'/%3E%3Cpath d='M19 12v7a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-7'/%3E%3Cpath d='M7.5 8a2.5 2.5 0 0 1 0-5A4.8 8 0 0 1 12 8a4.8 8 0 0 1 4.5-5 2.5 2.5 0 0 1 0 5'/%3E%3C/svg%3E") center/contain no-repeat;
		mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='8' width='18' height='4' rx='1'/%3E%3Cpath d='M12 8v13'/%3E%3Cpath d='M19 12v7a2 2 0 0 1-2 2H7a2 2 0 0 1-2-2v-7'/%3E%3Cpath d='M7.5 8a2.5 2.5 0 0 1 0-5A4.8 8 0 0 1 12 8a4.8 8 0 0 1 4.5-5 2.5 2.5 0 0 1 0 5'/%3E%3C/svg%3E") center/contain no-repeat
	}

	#process .section-head .eyebrow::before {
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='19' r='3'/%3E%3Cpath d='M9 19h8.5a3.5 3.5 0 0 0 0-7h-11a3.5 3.5 0 0 1 0-7H15'/%3E%3Ccircle cx='18' cy='5' r='3'/%3E%3C/svg%3E") center/contain no-repeat;
		mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='6' cy='19' r='3'/%3E%3Cpath d='M9 19h8.5a3.5 3.5 0 0 0 0-7h-11a3.5 3.5 0 0 1 0-7H15'/%3E%3Ccircle cx='18' cy='5' r='3'/%3E%3C/svg%3E") center/contain no-repeat
	}

	#location .section-head .eyebrow::before {
		-webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E") center/contain no-repeat;
		mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='black' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 10c0 6-8 12-8 12s-8-6-8-12a8 8 0 0 1 16 0Z'/%3E%3Ccircle cx='12' cy='10' r='3'/%3E%3C/svg%3E") center/contain no-repeat
	}

	.section-head .lede {
		margin: 0 auto
	}

	/* ====== ABOUT ====== */
	.about {
		background: var(--bg-soft)
	}

	.about-grid {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: 20px;
		margin-bottom: 48px
	}

	.stat-card {
		background: #fff;
		padding: 28px 24px;
		border-radius: var(--radius);
		border: 1px solid var(--line);
		box-shadow: var(--shadow-card);
		transition: all .25s
	}

	.stat-card:hover {
		transform: translateY(-3px);
		box-shadow: 0 8px 24px rgba(26, 86, 219, .08);
		border-color: var(--brand)
	}

	.stat-card .num {
		font-size: 38px;
		font-weight: 700;
		color: var(--brand);
		line-height: 1;
		margin-bottom: 8px;
		letter-spacing: -1px
	}

	.stat-card .lbl {
		font-size: 14px;
		color: var(--ink-2);
		font-weight: 500;
		margin-bottom: 4px
	}

	.stat-card .sub {
		font-size: 12px;
		color: var(--ink-3)
	}

	.about-narrative {
		display: grid;
		grid-template-columns: 1.2fr 1.6fr;
		gap: 40px 80px;
		align-items: stretch
	}

	.about-text {
		background: rgba(255, 255, 255, .7);
		border: 1px solid var(--line);
		border-radius: 8px;
		padding: 28px
	}

	.about-text h3 {
		font-size: 18px;
		color: var(--ink);
		margin-bottom: 14px
	}

	.about-text p {
		color: #333333;
		margin-bottom: 14px;
		font-size: 14px
	}

	.about-text p:last-child {
		margin-bottom: 0
	}

	.about-card {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 18px 26px;
		align-content: space-between
	}

	.about-card-item {
		padding-bottom: 10px;
		border-bottom: 1px solid var(--line)
	}

	.about-card-num {
		font-size: 28px;
		font-weight: 800;
		color: var(--brand);
		line-height: 1.15
	}

	.about-card-num .unit {
		font-size: 15px;
		font-weight: 700;
		margin-left: 3px
	}

	.about-card-desc {
		font-size: 13px;
		color: #797f8b;
		line-height: 1.6
	}

	/* ====== JOBS ====== */
	.job-tabs {
		display: flex;
		flex-wrap: wrap;
		gap: 10px;
		justify-content: center;
		margin-bottom: 34px
	}

	.job-tab {
		display: inline-flex;
		align-items: center;
		gap: 9px;
		cursor: pointer;
		user-select: none;
		font-size: 15px;
		font-weight: 600;
		color: var(--ink-3);
		padding: 11px 20px;
		border-radius: 999px;
		border: 1px solid var(--line-strong);
		background: #fff;
		box-shadow: var(--shadow-sm);
		transition: .2s
	}

	.job-tab .td {
		width: 26px;
		height: 26px;
		border-radius: 8px;
		display: grid;
		place-items: center;
		color: #fff;
		background: var(--ac);
		flex: none
	}

	.job-tab .td svg {
		width: 15px;
		height: 15px
	}

	.job-tab:hover {
		border-color: var(--ac);
		color: var(--ink)
	}

	.job-tab.active {
		background: var(--ac);
		color: #fff;
		border-color: var(--ac);
		box-shadow: 0 12px 24px -10px var(--ac)
	}

	.job-tab.active .td {
		background: rgba(255, 255, 255, .25)
	}

	.job-panel {
		display: none;
		animation: fade .4s ease
	}

	.job-panel.active {
		display: block
	}

	@keyframes fade {
		from {
			opacity: 0;
			transform: translateY(12px)
		}

		to {
			opacity: 1;
			transform: none
		}
	}

	.duty-cards {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 12px;
		margin-top: 4px
	}

	.duty-cards>.duty-card:nth-child(odd):last-child {
		grid-column: 1 / -1
	}

	@media(max-width:600px) {
		.duty-cards {
			grid-template-columns: 1fr
		}
	}

	.duty-title {
		font-size: 13px;
		font-weight: 600;
		color: var(--ac, var(--brand));
		margin: 18px 0 6px;
		text-align: left
	}

	.duty-card {
		background: var(--bg-soft);
		border: 1px solid var(--line);
		border-radius: 8px;
		padding: 14px 16px
	}

	.duty-card h5 {
		font-size: 14px;
		font-weight: 700;
		color: var(--ink);
		margin-bottom: 6px
	}

	.duty-card p {
		font-size: 13px;
		color: var(--ink-2);
		line-height: 1.6
	}

	.job {
		background: #fff;
		border: 1px solid var(--line);
		border-radius: var(--radius);
		padding: 24px;
		box-shadow: var(--shadow-sm);
		transition: .25s;
		position: relative;
		overflow: hidden
	}

	.job::after {
		content: "";
		position: absolute;
		inset: 0 0 auto 0;
		height: 4px;
		background: var(--ac);
		opacity: .9
	}

	.job:hover {
		transform: translateY(-5px);
		box-shadow: var(--shadow)
	}

	.job-top {
		display: flex;
		align-items: flex-start;
		justify-content: space-between;
		gap: 14px
	}

	.job h4 {
		font-size: 24px;
		font-weight: 700;
		display: flex;
		align-items: center;
		gap: 11px
	}

	.job .jb {
		flex: none;
		width: 44px;
		height: 44px;
		border-radius: 13px;
		display: grid;
		place-items: center;
		color: #fff;
		background: var(--ac);
		box-shadow: 0 8px 18px -8px var(--ac)
	}

	.job .jb svg {
		width: 23px;
		height: 23px
	}

	.job .duty {
		font-size: 14px;
		color: var(--ink-2);
		margin-bottom: 12px
	}

	.job .skills {
		display: flex;
		flex-wrap: wrap;
		gap: 7px;
		margin: 14px 0 6px
	}

	.skill {
		font-size: 12px;
		padding: 4px 11px;
		border-radius: 999px;
		background: var(--t-ac, var(--brand-light));
		color: var(--ac, var(--brand));
		font-weight: 600
	}

	.job .duties {
		list-style: none;
		margin: 14px 0 6px;
		display: grid;
		gap: 9px
	}

	.job .duties li {
		position: relative;
		padding-left: 30px;
		font-size: 13.5px;
		color: var(--ink-2);
		line-height: 1.55
	}

	.job .duties li .n {
		position: absolute;
		left: 0;
		top: 1px;
		width: 22px;
		height: 22px;
		border-radius: 7px;
		background: var(--t-ac, var(--brand-light));
		color: var(--ac, var(--brand));
		font-size: 11px;
		font-weight: 700;
		display: grid;
		place-items: center
	}

	/* ====== GROWTH ====== */
	.growth {
		background: linear-gradient(180deg, #0E3F9E 0%, #1A56DB 100%);
		color: #fff;
		position: relative;
		overflow: hidden
	}

	.growth::before {
		content: "";
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		background: radial-gradient(circle at 20% 30%, rgba(255, 255, 255, .08) 0%, transparent 50%);
		pointer-events: none
	}

	.growth .eyebrow {
		background: rgba(255, 255, 255, .15);
		color: #fff;
		border-color: #ddeaff4d
	}

	.growth .eyebrow::before {
		background: #fff
	}

	.growth h2 {
		color: #fff
	}

	.growth .lede {
		color: rgba(255, 255, 255, .85);
		margin: 0 auto
	}

	/* ====== GROWTH body (kimi-style, adapted to blue bg) ====== */
	.path-wrap {
		position: relative;
		margin-top: 56px;
		margin-bottom: 56px
	}

	.path {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: 20px;
		position: relative
	}

	.path::before {
		content: "";
		position: absolute;
		top: 26px;
		left: 12%;
		right: 12%;
		border-top: 1px dashed rgba(255, 255, 255, .4)
	}

	.pstep {
		text-align: center;
		position: relative;
		padding: 0 8px
	}

	.pdot {
		width: 52px;
		height: 52px;
		border-radius: 50%;
		background: #6695f8;
		border: none;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		margin: 0 auto 16px;
		position: relative;
		z-index: 2;
		font-weight: 700;
		font-size: 12px;
		box-shadow: 0 0 0 6px rgba(255, 255, 255, .12)
	}

	.pdot .ring {
		position: absolute;
		inset: 0;
		width: 52px;
		height: 52px;
		pointer-events: none
	}

	.pdot .ring circle {
		fill: none;
		stroke: #fff;
		stroke-width: 1;
		stroke-linecap: round;
		stroke-dasharray: 100;
		stroke-dashoffset: 100;
		transform: rotate(-90deg);
		transform-origin: 50% 50%;
		transition: stroke-dashoffset .6s ease
	}

	.pdot:hover .ring circle {
		stroke-dashoffset: 0
	}

	.pstep h4 {
		font-size: 16px;
		font-weight: 800;
		margin-bottom: 4px;
		color: #fff
	}

	.pstep p {
		font-size: 13px;
		color: rgba(255, 255, 255, .78);
		line-height: 1.6
	}

	.stages {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 20px
	}

	.stage {
		background: rgba(255, 255, 255, .08);
		border: 1px solid rgba(255, 255, 255, .2);
		border-radius: var(--radius);
		padding: 22px;
		transition: .25s
	}

	.stage:hover {
		border-color: rgba(255, 255, 255, .45);
		transform: translateY(-3px)
	}

	.sicon {
		width: 46px;
		height: 46px;
		border-radius: 12px;
		background: #5683e4;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		margin-bottom: 16px
	}

	.sicon svg {
		width: 24px;
		height: 24px
	}

	.stage small {
		color: var(--brand-light);
		font-weight: 700;
		font-size: 12px;
		letter-spacing: 1px
	}

	.stage h4 {
		font-size: 16.5px;
		font-weight: 800;
		margin: 4px 0 8px;
		color: #fff
	}

	.stage p {
		font-size: 13.5px;
		color: rgba(255, 255, 255, .78);
		line-height: 1.6;
		margin: 0
	}

	/* ====== BENEFITS ====== */
	.benefits {
		background: var(--bg-soft)
	}

	.benefit-grid {
		display: grid;
		grid-template-columns: repeat(4, 1fr);
		gap: 18px
	}

	.benefit-grid+.benefit-grid {
		margin-top: 18px
	}

	.benefit-grid.b2 {
		grid-template-columns: repeat(2, 1fr)
	}

	.benefit-grid.b3 {
		grid-template-columns: repeat(3, 1fr)
	}

	.benefit {
		background: #fff;
		border: 1px solid var(--line);
		border-radius: var(--radius);
		padding: 24px;
		box-shadow: var(--shadow-sm);
		transition: .25s
	}

	.benefit:hover {
		transform: translateY(-4px);
		box-shadow: var(--shadow)
	}

	.benefit .bi {
		width: 50px;
		height: 50px;
		border-radius: 15px;
		display: grid;
		place-items: center;
		color: #fff;
		background: var(--ac, var(--brand));
		margin-bottom: 16px;
		box-shadow: 0 10px 20px -10px var(--ac, var(--brand))
	}

	.benefit .bi svg {
		width: 25px;
		height: 25px
	}

	.benefit-img {
		width: 100%;
		height: auto;
		display: block;
		border-radius: 2px;
		margin-bottom: 14px
	}

	.benefit h4 {
		font-size: 15.5px;
		font-weight: 600;
		color: var(--ink);
		margin-bottom: 8px
	}

	.benefit p {
		font-size: 13.5px;
		color: var(--ink-2);
		line-height: 1.65;
		margin: 0
	}

	.benefit.more {
		grid-column: span 3
	}

	.benefit.more h4 {
		display: flex;
		align-items: center;
		gap: 9px;
		margin-bottom: 14px
	}

	.benefit.more h4 svg {
		width: 18px;
		height: 18px;
		color: var(--brand-deep)
	}

	.btags {
		display: flex;
		flex-wrap: wrap;
		gap: 10px
	}

	.btag {
		font-size: 12px;
		padding: 5px 11px;
		border-radius: 8px;
		background: #f3f7fc;
		color: var(--ink-2);
		border: 1px solid var(--line)
	}

	/* ====== PROCESS ====== */
	.process {
		padding-bottom: 60px
	}

	.steps {
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		gap: 14px
	}

	.step {
		background: #fff;
		border: 1px solid var(--line);
		border-radius: var(--radius);
		padding: 24px 20px;
		box-shadow: var(--shadow-sm);
		position: relative;
		transition: .25s;
		text-align: center
	}

	.step:hover,
	.step.hovered {
		transform: translateY(-4px);
		box-shadow: var(--shadow)
	}

	.step .no {
		width: 46px;
		height: 46px;
		border-radius: 13px;
		display: grid;
		place-items: center;
		background: var(--brand-light);
		color: var(--brand);
		margin: 0 auto 14px
	}

	.step .no svg {
		width: 24px;
		height: 24px
	}

	.steps-rail {
		position: relative;
		margin-top: 28px
	}

	.rail-line {
		position: absolute;
		top: 50%;
		left: 10%;
		right: 10%;
		height: 1px;
		background: rgba(26, 86, 219, .25);
		transform: translateY(-50%)
	}

	.rail-dots {
		display: grid;
		grid-template-columns: repeat(5, 1fr);
		gap: 14px;
		position: relative;
		z-index: 1
	}

	.rail-dot {
		width: 32px;
		height: 32px;
		border-radius: 50%;
		background: #3473f6;
		color: #fff;
		display: flex;
		align-items: center;
		justify-content: center;
		font-weight: 700;
		font-size: 12px;
		margin: 0 auto;
		transition: transform .25s ease, box-shadow .25s ease
	}

	.rail-dot:hover,
	.rail-dot.hovered {
		transform: translateY(-6px);
		box-shadow: 0 10px 18px -8px rgba(52, 115, 246, .5)
	}

	.step h4 {
		font-size: 16px;
		font-weight: 600;
		margin: 4px 0 8px;
		color: var(--ink)
	}

	.step .tm {
		font-size: 12.5px;
		color: #2b69e0;
		font-weight: 600;
		margin-bottom: 6px
	}

	.step p {
		font-size: 13px;
		color: var(--ink-2);
		line-height: 1.55;
		margin: 0
	}

	.promise {
		margin-top: 34px;
		text-align: center;
		background: rgba(26, 86, 219, .08);
		border-radius: var(--radius);
		padding: 22px;
		font-size: 15px;
		color: var(--ink-2)
	}

	.promise b {
		color: var(--brand-deep)
	}

	/* ====== LOCATION ====== */
	.location {
		background: var(--bg-soft)
	}

	.loc-grid {
		display: grid;
		grid-template-columns: 0.9fr 1.7fr;
		gap: 48px;
		align-items: stretch
	}

	.loc-list {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		grid-auto-rows: 1fr;
		gap: 12px;
		margin-top: 16px
	}

	.loc-item {
		background: #fff;
		border: 1px solid var(--line);
		border-radius: var(--radius);
		padding: 12px 16px;
		display: flex;
		align-items: center;
		gap: 12px;
		transition: all .2s
	}

	.loc-item:hover {
		border-color: var(--brand);
		transform: translateX(4px)
	}

	.loc-list a.loc-item {
		text-decoration: none;
		color: inherit
	}

	.loc-flag {
		width: 34px;
		height: 34px;
		border-radius: 8px;
		background: var(--brand-light);
		color: var(--brand);
		display: grid;
		place-items: center;
		font-weight: 600;
		font-size: 12px;
		flex-shrink: 0
	}

	.loc-info h4 {
		font-size: 14px;
		color: var(--ink);
		margin-bottom: 2px
	}

	.loc-info p {
		font-size: 12px;
		color: var(--ink-3);
		margin: 0
	}

	.loc-visual {
		background: linear-gradient(135deg, #ebf2ff 0%, #c8d3e9 100%);
		border-radius: 20px;
		padding: 28px 28px;
		color: var(--ink);
		position: relative;
		overflow: hidden;
		display: flex;
		flex-direction: column
	}

	.loc-visual h3 {
		color: var(--ink);
		font-size: 20px;
		margin-bottom: 8px;
		position: relative
	}

	.loc-visual p {
		color: var(--ink-2);
		font-size: 14px;
		margin-bottom: 14px;
		position: relative
	}

	.loc-building {
		display: block;
		width: 100%;
		border-radius: 12px;
		margin-top: 2px;
		flex: 1 1 auto;
		min-height: 140px;
		object-fit: cover
	}

	/* ====== APPLY ====== */
	.apply-sec {
		position: relative;
		overflow: hidden;
		/* background: linear-gradient(135deg, #0E3F9E 0%, #1A56DB 100%); */
		background-image: url('../images/2-l.png'), url('../images/2-r.png');
		background-position: left center, right center;
		background-repeat: no-repeat, no-repeat;
		background-size: auto 100%, auto 100%;
		background-color: #0b4acf;
		color: #fff;
		padding: 44px 0
	}


	.apply {
		position: relative;
		padding: 30px 24px;
		text-align: center
	}

	.apply-sec .blob {
		position: absolute;
		border-radius: 50%;
		filter: blur(50px);
		opacity: .35
	}

	.apply-sec .ab1 {
		width: 360px;
		height: 360px;
		background: #9ec9ff;
		top: -120px;
		right: -80px
	}

	.apply-sec .ab2 {
		width: 320px;
		height: 320px;
		background: #c9b6ff;
		bottom: -110px;
		left: -60px
	}

	.apply-inner {
		position: relative;
		z-index: 1
	}

	.apply h2 {
		color: #fff;
		font-size: clamp(24px, 3.2vw, 34px);
		font-weight: 700;
		letter-spacing: -.4px;
		margin-bottom: 0
	}

	.apply .sub {
		margin-top: 12px;
		font-size: 15px;
		opacity: .92;
		max-width: none;
		margin-left: auto;
		margin-right: auto
	}

	.apply .btns {
		display: flex;
		gap: 14px;
		justify-content: center;
		margin-top: 22px;
		flex-wrap: wrap
	}

	.apply .btns a svg {
		width: 15px !important;
		height: 15px !important
	}

	.apply .btn-white {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		background: #fff;
		color: var(--brand);
		padding: 10px 20px;
		border-radius: 8px;
		font-size: 14px;
		font-weight: 600;
		transition: .2s
	}

	.apply .btn-white:hover {
		transform: translateY(-2px);
		box-shadow: 0 12px 26px -10px rgba(0, 0, 0, .3)
	}

	.apply .btn-line {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		background: rgba(255, 255, 255, .16);
		color: #fff;
		border: 1px solid rgba(255, 255, 255, .5);
		padding: 10px 20px;
		border-radius: 8px;
		font-size: 14px;
		font-weight: 600;
		transition: .2s;
	}

	.apply .btn-line:hover {
		background: rgba(255, 255, 255, .28)
	}

	.apply .contact {
		display: flex;
		gap: 24px;
		justify-content: center;
		margin-top: 40px;
		flex-wrap: wrap;
		font-size: 14px;
	}

	.apply .contact span,
	.apply .contact a {
		display: inline-flex;
		align-items: center;
		gap: 8px;
		color: rgba(255, 255, 255, 0.64);
		text-decoration: none
	}

	.apply .contact a:hover {
		text-decoration: underline
	}

	.apply .contact svg {
		width: 16px;
		height: 16px
	}

	@media(max-width:768px) {

		.apply-sec::before,
		.apply-sec::after {
			display: none
		}
	}

	/* ====== FAQ ====== */
	.faq {
		background: #fff
	}

	.faq-grid {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 14px
	}

	.faq-item {
		background: var(--bg-soft);
		border: 1px solid var(--line);
		border-radius: var(--radius);
		padding: 16px 18px;
		transition: all .2s
	}

	.faq-item:hover {
		border-color: var(--brand)
	}

	.faq-item .q {
		font-size: 14px;
		font-weight: 500;
		color: var(--brand);
		margin-bottom: 6px;
		display: flex;
		align-items: start;
		gap: 10px
	}

	.faq-item .q::before {
		content: "Q";
		flex-shrink: 0;
		width: 22px;
		height: 22px;
		background: var(--brand-light);
		color: var(--brand);
		border-radius: 50%;
		display: grid;
		place-items: center;
		font-size: 12px;
		font-weight: 600
	}

	.faq-item .a {
		font-size: 13px;
		color: var(--ink-2);
		line-height: 1.6;
		padding-left: 32px;
		margin: 0
	}

	/* ====== FOOTER ====== */
	footer {
		background: #0A1A3A;
		color: rgba(255, 255, 255, .7);
		padding: 48px 0 32px;
		text-align: center;
		font-size: 13px
	}

	footer .logo {
		color: #fff;
		justify-content: center;
		margin-bottom: 16px
	}

	footer .logo .logo-mark {
		background: rgba(255, 255, 255, .15)
	}

	footer p {
		margin-bottom: 6px
	}

	footer .links {
		margin-top: 16px;
		display: flex;
		gap: 20px;
		justify-content: center;
		flex-wrap: wrap
	}

	footer .links a {
		color: rgba(255, 255, 255, .55);
		font-size: 12px;
		transition: color .2s
	}

	footer .links a:hover {
		color: #fff
	}

	@media(max-width:980px) {

		.hero-inner,
		.about-narrative,
		.loc-grid,
		.faq-grid,
		.path,
		.stages {
			grid-template-columns: 1fr
		}

		.benefit-grid,
		.benefit-grid.b2,
		.benefit-grid.b3 {
			grid-template-columns: 1fr
		}

		.steps {
			grid-template-columns: 1fr
		}

		.steps-rail {
			display: none
		}

		.hero h1 {
			font-size: 28px;
			margin-bottom: 10px
		}

		h2 {
			font-size: 26px
		}

		section {
			padding: 60px 0
		}

		/* nav mobile: hide links, keep logo + CTA on one line */
		.nav-links {
			display: none
		}

		.logo {
			white-space: nowrap
		}

		.logo span {
			white-space: nowrap
		}

		.nav-cta {
			white-space: nowrap;
			flex-shrink: 0;
			padding: 9px 14px
		}

		/* growth path mobile: vertical timeline, dot left + text right */
		.path {
			gap: 0
		}

		.path::before {
			top: 40px;
			bottom: 40px;
			left: 26px;
			right: auto;
			border-top: none;
			border-left: 1px dashed rgba(255, 255, 255, .4)
		}

		.pstep {
			display: grid;
			grid-template-columns: 52px 1fr;
			column-gap: 16px;
			text-align: left;
			padding: 16px 0
		}

		.pdot {
			grid-row: 1 / span 2;
			grid-column: 1;
			align-self: center;
			margin: 0
		}

		.pstep h4 {
			grid-column: 2;
			text-align: left
		}

		.pstep p {
			grid-column: 2;
			margin: 0;
			text-align: left
		}

		/* stages mobile: icon left, small/h4 stacked right */
		.stage {
			display: grid;
			grid-template-columns: 46px 1fr;
			column-gap: 12px;
			align-items: start
		}

		.sicon {
			grid-row: 1 / span 2;
			grid-column: 1;
			align-self: center;
			margin: 0
		}

		.stage small {
			grid-column: 2;
			margin: 0
		}

		.stage h4 {
			grid-column: 2;
			margin: 2px 0 0;
			text-align: left
		}

		.stage p {
			grid-column: 1 / -1;
			margin: 10px 0 0;
			text-align: left
		}

		/* card gaps only (compact) */
		.benefit-grid {
			gap: 10px
		}

		.benefit-grid+.benefit-grid {
			margin-top: 10px
		}

		.steps {
			gap: 10px
		}

		.stages {
			gap: 10px
		}

		.faq-grid {
			gap: 10px
		}

		.duty-cards {
			gap: 8px
		}

		.loc-list {
			gap: 8px
		}

		.section-head {
			margin: 0 auto 20px
		}

		.loc-list {
			grid-template-columns: repeat(2, 1fr)
		}

		.loc-flag {
			width: 28px;
			height: 28px;
			font-size: 10px;
			border-radius: 6px
		}

		.loc-more {
			display: none
		}

		.eyebrow.eyebrow-front-grid {
			font-size: 12px;
			padding: 7px 18px;
			border-radius: 22px
		}

		.cred-val {
			font-size: 14px
		}

		.btn-primary,
		.btn-ghost {
			padding: 9px 16px;
			font-size: 13px
		}

		.hero-btns {
			gap: 10px
		}

		.hero {
			min-height: 700px
		}

		.hero .lede {
			font-size: 12px;
			margin-bottom: 16px
		}

		.banner-text {
			margin-bottom: 100px;
		}

		.hero-bg {
			background-image: url('../images/bannerm.jpg') !important;
			background-position: center 70%;
		}


		/* process steps mobile: left aligned, icon + title on one row */
		.step {
			display: grid;
			grid-template-columns: 46px 1fr;
			column-gap: 12px;
			text-align: left;
			align-items: start
		}

		.step .no {
			grid-row: 1 / span 2;
			grid-column: 1;
			align-self: center;
			margin: 0
		}

		.step h4 {
			grid-column: 2;
			margin: 0 0 2px;
			text-align: left
		}

		.step .tm {
			grid-column: 2;
			margin: 0;
			text-align: left
		}

		.step p {
			grid-column: 1 / -1;
			margin: 10px 0 0;
			text-align: left
		}

		/* duty-card fold on mobile: only first expanded, chevron top-right */
		.duty-card {
			position: relative;
			cursor: pointer;
			padding-right: 30px;
			display: grid;
			grid-template-rows: auto 0fr;
			transition: grid-template-rows .35s cubic-bezier(.4, 0, .2, 1)
		}

		.duty-card.open {
			grid-template-rows: auto 1fr
		}

		.duty-card h5 {
			margin-bottom: 0;
			padding-right: 0
		}

		.duty-card p {
			min-height: 0;
			overflow: hidden;
			opacity: 0;
			margin-top: 0;
			transition: opacity .25s ease, margin-top .3s ease
		}

		.duty-card.open p {
			opacity: 1;
			margin-top: 8px
		}

		.duty-card::after {
			content: "";
			position: absolute;
			top: 19px;
			right: 15px;
			width: 8px;
			height: 8px;
			border-right: 2px solid var(--t-ac, var(--brand));
			border-bottom: 2px solid var(--t-ac, var(--brand));
			transform: rotate(45deg);
			transition: transform .35s cubic-bezier(.4, 0, .2, 1)
		}

		.duty-card.open::after {
			transform: rotate(-135deg)
		}
	}

	/* ====== 移动端紧凑适配（≤767px）：整体缩小尺寸 ====== */
	@media(max-width:767px) {

		.container {
			padding: 0 16px
		}

		/* nav */
		.nav-inner {
			height: 52px
		}

		.logo img {
			height: 24px !important
		}

		.logo span {
			font-size: 12px !important;
			padding-top: 10px !important
		}

		.nav-cta {
			padding: 7px 12px;
			font-size: 12px;
			border-radius: 6px
		}

		/* hero */
		.hero {
			min-height: 0;
			padding: 70px 0 30px
		}

		.hero h1 {
			font-size: 22px;
			line-height: 1.35;
			margin-top: 0px !important;
			margin-bottom: 8px;
			letter-spacing: 0
		}

		.hero .lede {
			font-size: 12px;
			line-height: 20px;
			margin-bottom: 14px
		}

		.hero-nav {
			width: 30px;
			height: 30px;
			top: unset;
			bottom: 20px;
		}

		.hero-nav svg {
			width: 15px;
			height: 15px
		}

		.hero-nav.prev {
			left: 8px
		}

		.hero-nav.next {
			right: 8px
		}

		.hero-cta {
			gap: 16px
		}

		.hero-btns {
			gap: 8px
		}

		.btn-primary,
		.btn-ghost {
			padding: 8px 14px;
			font-size: 12px;
			border-radius: 6px
		}

		.hero-creds {
			gap: 14px;
			padding-top: 14px
		}

		.cred-lab {
			font-size: 11px;
			margin-bottom: 2px
		}

		.cred-val {
			font-size: 12px
		}

		.cred-code {
			font-size: 11px
		}

		.eyebrow {
			font-size: 11px;
			padding: 4px 12px
		}

		.eyebrow.eyebrow-front-grid {
			display: none
		}

		/* sections 全局 */
		section {
			padding: 36px 0
		}

		h2 {
			font-size: 18px;
			margin-bottom: 8px
		}

		h3 {
			font-size: 16px
		}

		.lede {
			font-size: 12px;
			line-height: 20px
		}

		.section-head {
			margin: 0 auto 20px
		}

		/* about */
		.about-grid {
			grid-template-columns: repeat(2, 1fr);
			gap: 10px;
			margin-bottom: 24px
		}

		.stat-card {
			padding: 14px 12px;
			border-radius: 10px
		}

		.stat-card .num {
			font-size: 24px;
			margin-bottom: 4px
		}

		.stat-card .lbl {
			font-size: 12px
		}

		.stat-card .sub {
			font-size: 11px
		}

		.about-narrative {
			gap: 14px
		}

		.about-text {
			padding: 16px
		}

		.about-text h3 {
			font-size: 15px;
			margin-bottom: 8px
		}

		.about-text p {
			font-size: 12px;
			line-height: 20px;
			margin-bottom: 8px
		}

		.about-card {
			padding: 16px;
			grid-template-columns: 1fr 1fr;
			gap: 16px
		}

		.about-card-num {
			font-size: 20px
		}

		.about-card-num .unit {
			font-size: 12px
		}

		.about-card-desc {
			font-size: 10px;
			line-height: 16px;
		}

		/* jobs */
		.job-tabs {
			gap: 8px;
			margin-bottom: 18px
		}

		.job-tab {
			font-size: 11px;
			padding: 5px 10px;
			gap: 6px
		}

		.job-tab .td {
			display: none;
			width: 20px;
			height: 20px;
			border-radius: 6px
		}

		.job-tab .td svg {
			width: 12px;
			height: 12px
		}

		.job {
			padding: 16px 16px;
			border-radius: 10px
		}

		.job h4 {
			font-size: 17px;
			gap: 8px
		}

		.job .jb {
			width: 34px;
			height: 34px;
			border-radius: 10px
		}

		.job .jb svg {
			width: 18px;
			height: 18px
		}

		.job .duty {
			font-size: 12px;
			line-height: 20px;
			margin-bottom: 8px
		}

		.skill {
			font-size: 11px;
			padding: 3px 9px
		}

		.job .duties {
			gap: 7px;
			margin: 10px 0 4px
		}

		.job .duties li {
			font-size: 12px;
			line-height: 18px;
			padding-left: 26px
		}

		.job .duties li .n {
			width: 18px;
			height: 18px;
			font-size: 10px;
			border-radius: 6px
		}

		.duty-title {
			font-size: 12px;
			margin: 12px 0 8px
		}

		.duty-card {
			padding: 5px 28px 5px 12px
		}

		.duty-card h5 {
			font-size: 12px
		}

		.duty-card p {
			font-size: 11px;
			line-height: 18px;
			margin-top: 6px
		}

		.duty-card::after {
			top: 15px;
			right: 12px;
			width: 7px;
			height: 7px
		}

		/* growth */
		.path-wrap {
			margin-top: 28px;
			margin-bottom: 28px
		}

		.path::before {
			top: 30px;
			bottom: 30px;
			left: 21px
		}

		.pstep {
			grid-template-columns: 42px 1fr;
			column-gap: 12px;
			padding: 10px 0
		}

		.pdot {
			width: 42px;
			height: 42px;
			font-size: 10px;
			font-weight: 400;
			box-shadow: 0 0 0 4px rgba(255, 255, 255, .12)
		}

		.pdot .ring {
			width: 42px;
			height: 42px
		}

		.pstep h4 {
			font-size: 14px;
			margin-bottom: 2px
		}

		.pstep p {
			font-size: 12px;
			line-height: 18px
		}

		.stage {
			padding: 14px;
			border-radius: 10px;
			grid-template-columns: 38px 1fr;
			column-gap: 10px
		}

		.sicon {
			width: 38px;
			height: 38px;
			border-radius: 10px
		}

		.sicon svg {
			width: 19px;
			height: 19px
		}

		.stage small {
			font-size: 11px
		}

		.stage h4 {
			font-size: 14px;
			margin: 2px 0 0
		}

		.stage p {
			font-size: 12px;
			line-height: 18px;
			margin: 8px 0 0
		}

		/* benefits */
		.benefit {
			padding: 14px;
			border-radius: 10px
		}

		.benefit .bi {
			width: 38px;
			height: 38px;
			border-radius: 11px;
			margin-bottom: 10px
		}

		.benefit .bi svg {
			width: 19px;
			height: 19px
		}

		.benefit-img {
			margin-bottom: 10px;
			height: 110px;
		}

		.benefit h4 {
			font-size: 14px;
			margin-bottom: 4px
		}

		.benefit p {
			font-size: 12px;
			line-height: 20px
		}

		.btags {
			gap: 8px
		}

		.btag {
			font-size: 11px;
			padding: 4px 9px;
			border-radius: 6px
		}

		/* process */
		.process {
			padding-bottom: 36px
		}

		.step {
			padding: 14px 16px;
			border-radius: 10px;
			grid-template-columns: 38px 1fr;
			column-gap: 10px
		}

		.step .no {
			width: 38px;
			height: 38px;
			border-radius: 10px
		}

		.step .no svg {
			width: 19px;
			height: 19px
		}

		.step h4 {
			font-size: 14px;
			margin: 0 0 2px
		}

		.step .tm {
			font-size: 11px
		}

		.step p {
			font-size: 12px;
			line-height: 18px;
			margin: 8px 0 0
		}

		.promise {
			margin-top: 18px;
			padding: 14px 16px;
			font-size: 12px;
			line-height: 20px;
			border-radius: 10px
		}

		/* location */
		.loc-grid {
			gap: 20px
		}

		.loc-list {
			grid-template-columns: repeat(2, 1fr);
			gap: 8px;
			margin-top: 12px
		}

		.loc-item {
			padding: 8px 10px;
			gap: 8px;
			border-radius: 10px
		}

		.loc-flag {
			width: 26px;
			height: 26px;
			font-size: 10px;
			border-radius: 6px
		}

		.loc-info h4 {
			font-size: 12px
		}

		.loc-info p {
			font-size: 11px
		}

		.loc-visual {
			padding: 16px;
			border-radius: 14px
		}

		.loc-visual h3 {
			font-size: 16px;
			margin-bottom: 4px
		}

		.loc-visual p {
			font-size: 12px;
			line-height: 20px;
			margin-bottom: 10px
		}

		.loc-building {
			min-height: 110px;
			border-radius: 10px
		}

		/* apply */
		.apply-sec {
			padding: 32px 0;
			background-image: url('../images/2-l.png');
			background-position: center;
			background-size: auto 100%;
		}

		.apply {
			padding: 0px
		}

		.apply h2 {
			font-size: 18px
		}

		.apply .sub {
			font-size: 12px;
			line-height: 20px;
			margin-top: 8px
		}

		.apply .btns {
			gap: 10px;
			margin-top: 16px
		}

		.apply .btn-white,
		.apply .btn-line {
			padding: 8px 14px;
			font-size: 12px;
			border-radius: 6px
		}

		.apply .contact {
			gap: 6px;
			margin-top: 22px;
			font-size: 12px
		}

		/* faq */
		.faq-item {
			padding: 12px;
			border-radius: 10px
		}

		.faq-item .q {
			font-size: 13px;
			gap: 8px;
			margin-bottom: 4px
		}

		.faq-item .q::before {
			width: 18px;
			height: 18px;
			font-size: 11px
		}

		.faq-item .a {
			font-size: 12px;
			line-height: 18px;
			padding-left: 26px
		}

		/* footer */
		footer {
			padding: 30px 0 22px;
			font-size: 12px
		}

		footer .logo {
			margin-bottom: 10px
		}

		footer p span {
			display: block;
			height: 0px;
		}

		footer .links {
			gap: 12px;
			margin-top: 10px
		}

		footer .links a {
			font-size: 11px
		}
	}

	@media (min-width: 1401px) {
		.container {
			max-width: 1200px;
		}
	}

	@media (min-width: 1601px) {
		.container {
			max-width: 1300px;
		}
	}

	@media (min-width: 1801px) {
		.container {
			max-width: 1400px;
		}
	}

	/* ====== PC 小屏适配（981-1600px）：banner 区域 ====== */
	@media (min-width: 981px) and (max-width: 1600px) {
		.hero {
			min-height: clamp(560px, 78vh, 760px)
		}

		/* 超宽图裁切时保住右侧楼体主体 */
		.hero-bg {
			background-position: 75% center
		}

		/* 左侧补白雾渐变，保证裁切后文字仍落在浅色区 */
		.hero::before {
			content: "";
			position: absolute;
			inset: 0;
			z-index: 1;
			pointer-events: none;
			background: linear-gradient(90deg, rgba(255, 255, 255, .92) 0%, rgba(255, 255, 255, .6) 38%, rgba(255, 255, 255, 0) 70%)
		}

		.hero h1 {
			font-size: 44px
		}

		.hero .lede {
			max-width: 600px
		}

		.hero-cta {
			gap: 22px
		}

		.hero-creds {
			gap: 24px;
			padding-top: 22px
		}
	}

	@media (min-width: 981px) and (max-width: 1200px) {
		.hero-bg {
			background-position: 85% center
		}

		.hero h1 {
			font-size: 36px;
			margin-bottom: 14px
		}

		.hero .lede {
			max-width: 520px;
			margin-bottom: 24px
		}

		.hero-cta {
			gap: 18px
		}

		.hero-creds {
			gap: 18px;
			padding-top: 18px
		}

		.cred-val {
			font-size: 16px
		}

		.cred-code {
			font-size: 13px
		}
	}