:root {
	--g: #25cc91;
	--g-dark: #1aa876;
	--g-light: #e8faf4;
	--p: #3a4150;
	--p-light: #f4f6f9;
	--p-mid: #e4e8ee;
	--p-dark: #2b3140;
	--ink: #222;
	--ink-60: rgba(17, 17, 17, 0.6);
	--white: #ffffff;
	--paper: #f9f9f9;
	--border: rgba(17, 17, 17, 0.12);
	--r: 8px;
	--r-lg: 14px;
	--r-pill: 100px;
}

* { box-sizing: border-box; }

html, body {
	margin: 0;
	min-height: 100%;
	font-family: "Noto Sans", sans-serif;
	background: var(--white);
	color: var(--ink);
	line-height: 1.6;
}

body::before {
	content: "";
	position: fixed;
	inset: 0 0 auto;
	height: 300px;
	background: linear-gradient(180deg, var(--paper), var(--white));
	pointer-events: none;
}

.vacancy-topbar {
	position: relative;
	z-index: 1;
	display: flex;
	align-items: center;
	justify-content: space-between;
	width: min(100%, 1080px);
	margin: 0 auto;
	padding: 16px 56px;
}

.vacancy-brand {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	color: var(--ink);
	font-size: 17px;
	font-weight: 700;
	text-decoration: none;
}

.vacancy-brand img { border-radius: var(--r); }

.vacancy-language {
	display: flex;
	align-items: center;
	gap: 10px;
	color: var(--ink-60);
	font-size: 14px;
	font-weight: 700;
}

.vacancy-language select {
	max-width: 180px;
	padding: 9px 32px 9px 12px;
	border: 1px solid var(--border);
	border-radius: var(--r);
	background: var(--white);
	color: var(--ink);
	font: inherit;
}

.vacancy-page {
	position: relative;
	z-index: 1;
	width: min(100% - 32px, 900px);
	margin: 0 auto;
	padding: 8px 0 64px;
}

.vacancy-card {
	border: 1px solid var(--border);
	border-radius: var(--r-lg);
	background: var(--white);
	box-shadow: 0 12px 40px rgba(17, 17, 17, .08);
	overflow: hidden;
}

.vacancy-hero {
	padding: 52px 56px 42px;
	background: var(--paper);
	border-bottom: 1px solid var(--border);
}

.vacancy-eyebrow {
	margin: 0 0 14px;
	color: var(--g-dark);
	font-size: 11px;
	font-weight: 700;
	letter-spacing: .1em;
	text-transform: uppercase;
}

.vacancy-hero h1 {
	max-width: 760px;
	margin: 0;
	font-size: clamp(26px, 3vw, 38px);
	font-weight: 800;
	line-height: 1.15;
	letter-spacing: -.02em;
}

.vacancy-lead {
	margin: 22px 0 0;
	color: var(--p);
	font-size: 17px;
	font-weight: 700;
	line-height: 1.4;
}

.vacancy-section {
	padding: 32px 56px;
	border-bottom: 1px solid var(--border);
}

.vacancy-section:last-child { border-bottom: 0; }

.vacancy-section h2 {
	margin: 0 0 17px;
	font-size: 22px;
	font-weight: 800;
	line-height: 1.3;
	letter-spacing: -.02em;
}

.vacancy-section p,
.vacancy-section li {
	color: var(--ink-60);
	font-size: 15px;
	line-height: 1.7;
}

.vacancy-section p { margin: 0 0 14px; }
.vacancy-section p:last-child { margin-bottom: 0; }
.vacancy-section ul, .vacancy-section ol { margin: 0 0 18px; padding-inline-start: 24px; }
.vacancy-section li { margin: 8px 0; padding-inline-start: 4px; }

.vacancy-conditions { background: var(--p-light); }
.vacancy-product { background: var(--g-light); }
.vacancy-apply { background: var(--g-light); }
.vacancy-apply a:not(.vacancy-cta) { color: var(--g-dark); font-weight: 700; }
.vacancy-section [data-paragraphs="product"] a {
	color: var(--ink);
	font-weight: 800;
}

.vacancy-cta {
	display: inline-flex;
	margin-top: 8px;
	padding: 13px 20px;
	border-radius: var(--r-pill);
	background: var(--g);
	color: var(--white);
	font-size: 14px;
	font-weight: 400;
	text-decoration: none;
	transition: background .18s, transform .15s;
}

.vacancy-cta:hover {
	background: var(--g-dark);
	transform: translateY(-1px);
}

[dir="rtl"] .vacancy-language select { padding: 9px 12px 9px 32px; }

@media (max-width: 640px) {
	.vacancy-topbar { align-items: flex-start; padding: 14px 24px; }
	.vacancy-language { flex-direction: column; align-items: flex-end; gap: 4px; }
	.vacancy-language span { font-size: 11px; }
	.vacancy-language select { max-width: 145px; }
	.vacancy-page { width: min(100% - 20px, 900px); padding-bottom: 28px; }
	.vacancy-card { border-radius: var(--r-lg); }
	.vacancy-hero { padding: 34px 24px 28px; }
	.vacancy-hero h1 { font-size: 30px; }
	.vacancy-lead { font-size: 16px; }
	.vacancy-section { padding: 26px 24px; }
	.vacancy-section h2 { font-size: 20px; }
	.vacancy-section p, .vacancy-section li { font-size: 14px; }
}