:root {
	--bg: #ffffff;
	--surface: #f6f8f3;
	--surface-2: #eef1ea;
	--text: #20242a;
	--text-soft: #515b64;
	--text-faint: #8a929b;
	--border: #e4e7e0;
	--accent: #4d8a29;
	--accent-strong: #3d6f20;
	--accent-soft: rgba(77, 138, 41, 0.10);
	--accent-line: rgba(77, 138, 41, 0.28);
	--radius: 12px;
	--maxw: 1080px;
}
@media (prefers-color-scheme: dark) {
	:root {
		--bg: #12151a;
		--surface: #1a1e24;
		--surface-2: #21262e;
		--text: #e7eaec;
		--text-soft: #a6afb8;
		--text-faint: #6d7680;
		--border: #2a2f37;
		--accent: #86c34e;
		--accent-strong: #9fd766;
		--accent-soft: rgba(134, 195, 78, 0.13);
		--accent-line: rgba(134, 195, 78, 0.32);
	}
}

* { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	color: var(--text);
	background: var(--bg);
	margin: 0;
	line-height: 1.62;
	font-size: 16px;
	-webkit-font-smoothing: antialiased;
}
.wrap { max-width: var(--maxw); margin: 0 auto; padding: clamp(1.5rem, 4vw, 3.5rem) clamp(1.1rem, 4vw, 2.5rem); }

a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }

/* ---------- Masthead ---------- */
.masthead {
	display: flex;
	flex-wrap: wrap;
	gap: 1.5rem 2rem;
	align-items: flex-end;
	justify-content: space-between;
	padding-bottom: 1.6rem;
	border-bottom: 1px solid var(--border);
}
h1 {
	font-size: clamp(2.1rem, 6vw, 3.1rem);
	line-height: 1.04;
	letter-spacing: -0.02em;
	margin: 0;
	font-weight: 700;
}
.role {
	margin: 0.55rem 0 0;
	font-size: clamp(1rem, 2.6vw, 1.18rem);
	color: var(--accent);
	font-weight: 600;
	letter-spacing: 0.01em;
}
.contact {
	list-style: none;
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: column;
	gap: 0.5rem;
	font-size: 0.94rem;
}
.contact li { display: flex; align-items: center; gap: 0.6rem; color: var(--text-soft); }
.contact a { color: var(--text-soft); }
.contact a:hover { color: var(--accent); }
.contact svg { width: 16px; height: 16px; flex: none; color: var(--accent); }
.dl-item { margin-top: 0.35rem; }
.contact .dl-btn {
	display: inline-flex; align-items: center; gap: 0.5rem;
	background: #5a9e2f; color: #0d1207; font-weight: 700; font-size: 0.9rem;
	padding: 0.45rem 0.95rem; border-radius: 8px; text-decoration: none;
	transition: background 0.15s ease;
}
.contact .dl-btn:hover { background: #67b338; color: #0d1207; text-decoration: none; }
.contact .dl-btn svg { width: 16px; height: 16px; flex: none; color: currentColor; }
@media (prefers-color-scheme: dark) {
	.contact .dl-btn { background: #86c34e; color: #0d1207; }
	.contact .dl-btn:hover { background: #97d15f; color: #0d1207; }
}

/* ---------- Layout ---------- */
.layout {
	display: grid;
	grid-template-columns: 1fr;
	gap: 2.4rem;
	margin-top: 2.2rem;
}
@media (min-width: 880px) {
	.layout { grid-template-columns: minmax(0, 2.3fr) minmax(230px, 1fr); gap: 3rem; }
	.aside { align-self: start; position: sticky; top: 2rem; }
}

section { margin: 0 0 2.2rem; }
.eyebrow {
	font-size: 0.74rem;
	font-weight: 700;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	color: var(--text-faint);
	margin: 0 0 1rem;
	padding-bottom: 0.5rem;
	border-bottom: 1px solid var(--border);
}

/* ---------- Summary ---------- */
.summary { font-size: 1.05rem; color: var(--text-soft); margin: 0 0 1rem; max-width: 62ch; }
.summary strong { color: var(--text); font-weight: 600; }

/* ---------- Experience ---------- */
.job { margin-bottom: 1.9rem; }
.job:last-child { margin-bottom: 0; }
.job-head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.2rem 1rem; }
.job-title { font-size: 1.12rem; font-weight: 700; margin: 0; letter-spacing: -0.01em; }
.job-title .co { color: var(--accent); }
.job-dates { font-size: 0.86rem; color: var(--text-faint); white-space: nowrap; font-variant-numeric: tabular-nums; }
.chips { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0.6rem 0 0.2rem; }
.chip {
	font-size: 0.76rem; font-weight: 600; letter-spacing: 0.02em;
	color: var(--accent-strong); background: var(--accent-soft);
	padding: 0.18rem 0.6rem; border-radius: 999px;
}
@media (prefers-color-scheme: dark) { .chip { color: var(--accent-strong); } }

ul.bullets { list-style: none; margin: 0.75rem 0 0; padding: 0; }
ul.bullets li { position: relative; padding-left: 1.35rem; margin: 0.4rem 0; color: var(--text-soft); }
ul.bullets li::before {
	content: ""; position: absolute; left: 0.15rem; top: 0.62em;
	width: 5px; height: 5px; border-radius: 50%;
	background: var(--text-faint);
}
ul.bullets li.win { color: var(--text); font-weight: 500; }
ul.bullets li.win::before {
	content: ""; left: 0; top: 0.5em;
	width: 8px; height: 8px; border-radius: 2px;
	background: var(--accent);
	box-shadow: 0 0 0 4px var(--accent-soft);
}
ul.bullets li.win b { color: var(--text); font-weight: 700; }

/* ---------- Projects ---------- */
.projects { display: grid; gap: 1rem 1.8rem; }
@media (min-width: 620px) { .projects { grid-template-columns: 1fr 1fr; } }
.project { padding: 0; }
.project h3 { margin: 0 0 0.15rem; font-size: 1rem; }
.project h3 .accent, .project h3 a { color: var(--accent); text-decoration: none; }
.project h3 a:hover { text-decoration: underline; }
.project p { margin: 0; color: var(--text-soft); font-size: 0.95rem; }
.project code { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.86em; background: var(--surface-2); padding: 0.05em 0.3em; border-radius: 4px; }

/* ---------- Aside / Skills ---------- */
.card {
	background: var(--surface);
	border: 1px solid var(--border);
	border-radius: var(--radius);
	padding: 1.2rem 1.25rem;
	margin-bottom: 1.1rem;
}
.card h2 {
	font-size: 0.74rem; font-weight: 700; letter-spacing: 0.13em; text-transform: uppercase;
	color: var(--text-faint); margin: 0 0 0.85rem;
}
.skill-list { display: flex; flex-wrap: wrap; gap: 0.4rem; }
.skill {
	font-size: 0.84rem; font-weight: 500;
	background: var(--surface-2); color: var(--text);
	padding: 0.28rem 0.65rem; border-radius: 7px;
	border: 1px solid var(--border);
}
.skill.lead { background: var(--accent-soft); border-color: var(--accent-line); color: var(--accent-strong); font-weight: 600; }
.inline-list { margin: 0; color: var(--text-soft); font-size: 0.92rem; line-height: 1.9; }

/* ---------- Footer ---------- */
.foot { margin-top: 2.5rem; padding-top: 1.4rem; border-top: 1px solid var(--border); font-size: 0.85rem; color: var(--text-faint); text-align: center; }
.foot a { color: var(--text-faint); }
.foot a:hover { color: var(--accent); }

/* ---------- Cover letter ---------- */
.letter { max-width: 68ch; margin-top: 2.4rem; }
.letter .meta { font-size: 0.94rem; color: var(--text-faint); margin: 0 0 1.8rem; }
.letter .addressee { margin: 0 0 1.6rem; color: var(--text-soft); }
.letter .addressee strong { color: var(--text); font-weight: 600; }
.letter .re { font-weight: 600; color: var(--text); margin: 0 0 1.6rem; }
.letter p { margin: 0 0 1.05rem; color: var(--text-soft); }
.letter p strong { color: var(--text); font-weight: 600; }
.letter .sign-off { margin-top: 1.8rem; }
.letter .sign-off .name { color: var(--text); font-weight: 600; margin: 0.3rem 0 0; }

/* ---------- Print ---------- */
@page { size: A4; margin: 12mm; }
@media print {
	:root {
		--bg: #fff; --surface: #fff; --surface-2: #fff;
		--text: #000; --text-soft: #222; --text-faint: #555;
		--border: #ccc; --accent: #2f6317; --accent-strong: #2f6317;
		--accent-soft: #eef3e8; --accent-line: #cdd9c0;
	}
	body { font-size: 10.5pt; line-height: 1.4; }
	.wrap { max-width: none; padding: 0; }
	.layout { grid-template-columns: minmax(0, 2.3fr) minmax(200px, 1fr); gap: 1.4rem; margin-top: 1.2rem; }
	.aside { position: static; }
	.card { border: 1px solid #ddd; padding: 0.7rem 0.8rem; break-inside: avoid; }
	.job, .project { break-inside: avoid; }
	.contact .dl-item, .foot { display: none; }
	ul.bullets li.win::before { box-shadow: none; }
	.letter { max-width: none; margin-top: 1.6rem; }
	.letter p { margin: 0 0 0.8rem; }
	.letter .meta, .letter .addressee, .letter .re { margin-bottom: 1.1rem; }
	a { color: #000; }
}
