/*
Theme Name: ERIC KIM Photo Humanist
Theme URI: https://erickimphotography.com/blog/
Author: ERIC KIM
Author URI: https://erickimphotography.com/
Description: Ultra-fast PHP 7.4-safe flagship photo blog theme for ERIC KIM: human artist centered, photography-first, AI-search legible, no external fonts, no theme JavaScript, brutal clarity.
Version: 1.0.0
Requires at least: 5.8
Tested up to: 6.8
Requires PHP: 7.4
License: GPL-2.0-or-later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: eric-kim-photo-humanist
Tags: blog, photography, one-column, custom-menu, featured-images, editor-style, wide-blocks
*/

:root {
	--ek-bg: #fffef8;
	--ek-ink: #050505;
	--ek-muted: #55524b;
	--ek-line: #171717;
	--ek-soft: #f3f0e8;
	--ek-accent: #d91f11;
	--ek-max: 1180px;
	--ek-text: 760px;
	--ek-radius: 0px;
	--ek-pad: clamp(18px, 4vw, 56px);
	--ek-font: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
	--ek-serif: ui-serif, Georgia, Cambria, "Times New Roman", Times, serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
	margin: 0;
	background: var(--ek-bg);
	color: var(--ek-ink);
	font-family: var(--ek-font);
	font-size: clamp(18px, 1.6vw, 21px);
	line-height: 1.55;
	text-rendering: optimizeLegibility;
	-webkit-font-smoothing: antialiased;
}

a { color: inherit; text-decoration-thickness: 0.08em; text-underline-offset: 0.16em; }
a:hover { color: var(--ek-accent); }

img, video, iframe { max-width: 100%; height: auto; }
img { display: block; }
::selection { background: var(--ek-ink); color: var(--ek-bg); }

.screen-reader-text, .skip-link {
	position: absolute;
	left: -9999px;
	width: 1px;
	height: 1px;
	overflow: hidden;
}
.skip-link:focus {
	left: var(--ek-pad);
	top: 12px;
	z-index: 9999;
	width: auto;
	height: auto;
	padding: 10px 14px;
	background: var(--ek-ink);
	color: var(--ek-bg);
}

.site-shell { min-height: 100vh; display: flex; flex-direction: column; }
.site-main { flex: 1; }

.site-header {
	border-bottom: 3px solid var(--ek-line);
	background: var(--ek-bg);
}
.header-inner {
	max-width: var(--ek-max);
	margin: 0 auto;
	padding: 18px var(--ek-pad);
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 24px;
	align-items: center;
}
.site-branding { min-width: 0; }
.site-title {
	margin: 0;
	font-size: clamp(28px, 5.8vw, 82px);
	line-height: .86;
	letter-spacing: -0.085em;
	font-weight: 950;
	text-transform: uppercase;
}
.site-title a { text-decoration: none; }
.site-description {
	margin: 6px 0 0;
	font-size: 12px;
	line-height: 1.25;
	font-weight: 900;
	letter-spacing: .22em;
	text-transform: uppercase;
	color: var(--ek-muted);
}
.site-nav .menu {
	list-style: none;
	padding: 0;
	margin: 0;
	display: flex;
	flex-wrap: wrap;
	justify-content: flex-end;
	gap: 8px;
}
.site-nav a {
	display: block;
	padding: 8px 10px;
	border: 2px solid var(--ek-line);
	font-size: 12px;
	line-height: 1;
	font-weight: 950;
	letter-spacing: .09em;
	text-transform: uppercase;
	text-decoration: none;
	background: var(--ek-bg);
}
.site-nav a:hover { background: var(--ek-ink); color: var(--ek-bg); }

.hero {
	max-width: var(--ek-max);
	margin: 0 auto;
	padding: clamp(42px, 8vw, 110px) var(--ek-pad) clamp(26px, 4vw, 54px);
	border-bottom: 3px solid var(--ek-line);
}
.hero-kicker, .archive-kicker, .card-kicker, .note-label, .entry-meta, .post-tags, .search-label {
	font-size: 12px;
	font-weight: 950;
	letter-spacing: .18em;
	text-transform: uppercase;
	color: var(--ek-muted);
}
.hero-title {
	max-width: 980px;
	margin: 0;
	font-size: clamp(56px, 12vw, 190px);
	line-height: .78;
	letter-spacing: -0.095em;
	font-weight: 1000;
	text-transform: uppercase;
}
.hero-subtitle {
	max-width: 760px;
	margin: 22px 0 0;
	font-family: var(--ek-serif);
	font-size: clamp(24px, 4vw, 48px);
	line-height: 1.02;
	letter-spacing: -0.04em;
}
.hero-rail {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 1px;
	margin-top: 34px;
	border: 3px solid var(--ek-line);
	background: var(--ek-line);
}
.hero-rail div {
	background: var(--ek-bg);
	padding: 14px;
	font-size: 12px;
	font-weight: 950;
	letter-spacing: .12em;
	text-transform: uppercase;
}

.search-wrap { margin-top: 28px; max-width: 720px; }
.search-form {
	display: grid;
	grid-template-columns: 1fr auto;
	border: 3px solid var(--ek-line);
	background: var(--ek-bg);
}
.search-field {
	min-width: 0;
	border: 0;
	padding: 16px 18px;
	font: inherit;
	font-weight: 800;
	background: transparent;
	color: var(--ek-ink);
	outline: none;
}
.search-submit {
	border: 0;
	border-left: 3px solid var(--ek-line);
	padding: 0 18px;
	background: var(--ek-ink);
	color: var(--ek-bg);
	font-size: 12px;
	font-weight: 950;
	letter-spacing: .18em;
	text-transform: uppercase;
	cursor: pointer;
}
.search-submit:hover { background: var(--ek-accent); }

.content-wrap {
	max-width: var(--ek-max);
	margin: 0 auto;
	padding: 38px var(--ek-pad) 70px;
}
.archive-header, .not-found {
	max-width: var(--ek-text);
	margin: 0 0 32px;
}
.archive-title, .page-title {
	margin: 0;
	font-size: clamp(44px, 8vw, 112px);
	line-height: .82;
	letter-spacing: -0.085em;
	font-weight: 1000;
	text-transform: uppercase;
}
.archive-description { margin-top: 18px; color: var(--ek-muted); }

.post-grid {
	display: grid;
	grid-template-columns: repeat(12, minmax(0, 1fr));
	gap: 18px;
}
.post-card {
	grid-column: span 6;
	border: 3px solid var(--ek-line);
	background: var(--ek-bg);
	min-height: 100%;
	display: flex;
	flex-direction: column;
}
.post-card:nth-child(1) { grid-column: span 12; }
.post-card.has-thumb:nth-child(1) { display: grid; grid-template-columns: 1.1fr .9fr; }
.card-image { border-bottom: 3px solid var(--ek-line); background: var(--ek-soft); }
.post-card:nth-child(1) .card-image { border-bottom: 0; border-right: 3px solid var(--ek-line); }
.card-image img {
	width: 100%;
	height: 100%;
	aspect-ratio: 4 / 3;
	object-fit: cover;
	filter: grayscale(1) contrast(1.12);
}
.card-body { padding: clamp(18px, 3vw, 34px); flex: 1; }
.card-title {
	margin: 6px 0 12px;
	font-size: clamp(30px, 4.4vw, 72px);
	line-height: .88;
	letter-spacing: -0.07em;
	font-weight: 1000;
	text-transform: uppercase;
}
.card-title a { text-decoration: none; }
.card-excerpt { max-width: 720px; color: var(--ek-ink); }
.card-read {
	margin-top: 20px;
	display: inline-block;
	font-size: 12px;
	font-weight: 950;
	letter-spacing: .18em;
	text-transform: uppercase;
}
.entry-meta { margin-top: 10px; }
.entry-meta a { color: var(--ek-muted); }

.pagination, .nav-links {
	margin-top: 42px;
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}
.pagination a, .pagination span, .nav-links a, .nav-links span {
	border: 3px solid var(--ek-line);
	padding: 10px 14px;
	font-size: 12px;
	font-weight: 950;
	letter-spacing: .14em;
	text-transform: uppercase;
	text-decoration: none;
}
.pagination .current, .nav-links a:hover { background: var(--ek-ink); color: var(--ek-bg); }

.single-wrap {
	max-width: var(--ek-max);
	margin: 0 auto;
	padding: 42px var(--ek-pad) 74px;
}
.entry-header { max-width: 1040px; }
.entry-title {
	margin: 0;
	font-size: clamp(52px, 10.5vw, 168px);
	line-height: .78;
	letter-spacing: -0.1em;
	font-weight: 1000;
	text-transform: uppercase;
}
.entry-dek {
	max-width: 760px;
	margin: 24px 0 0;
	font-family: var(--ek-serif);
	font-size: clamp(24px, 3.5vw, 44px);
	line-height: 1.08;
	letter-spacing: -0.035em;
}
.featured-photo {
	margin: clamp(28px, 5vw, 64px) calc(var(--ek-pad) * -1) 34px;
	border-top: 3px solid var(--ek-line);
	border-bottom: 3px solid var(--ek-line);
	background: var(--ek-line);
}
.featured-photo img {
	width: 100%;
	max-height: 88vh;
	object-fit: contain;
	background: var(--ek-line);
}
.featured-caption {
	padding: 10px var(--ek-pad);
	background: var(--ek-bg);
	border-top: 3px solid var(--ek-line);
	font-size: 13px;
	font-weight: 800;
	color: var(--ek-muted);
}

.human-notes {
	max-width: var(--ek-text);
	margin: 30px 0;
	border: 3px solid var(--ek-line);
	background: var(--ek-soft);
}
.human-notes-title {
	margin: 0;
	padding: 14px 18px;
	border-bottom: 3px solid var(--ek-line);
	font-size: 13px;
	font-weight: 1000;
	letter-spacing: .18em;
	text-transform: uppercase;
}
.human-note-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; background: var(--ek-line); }
.human-note {
	background: var(--ek-bg);
	padding: 16px 18px;
}
.note-value { margin-top: 6px; font-weight: 850; }

.entry-content {
	max-width: var(--ek-text);
	font-family: var(--ek-serif);
	font-size: clamp(22px, 2.4vw, 30px);
	line-height: 1.34;
	letter-spacing: -0.02em;
}
.entry-content > * { margin-top: 0; margin-bottom: 1.1em; }
.entry-content p { hanging-punctuation: first; }
.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4 {
	font-family: var(--ek-font);
	line-height: .9;
	letter-spacing: -0.07em;
	font-weight: 1000;
	text-transform: uppercase;
	margin-top: 1.25em;
}
.entry-content h2 { font-size: clamp(40px, 6.5vw, 96px); }
.entry-content h3 { font-size: clamp(30px, 4.5vw, 62px); }
.entry-content blockquote {
	margin-left: 0;
	padding-left: 22px;
	border-left: 6px solid var(--ek-line);
	font-family: var(--ek-font);
	font-weight: 950;
	font-size: clamp(28px, 4vw, 56px);
	line-height: .95;
	letter-spacing: -0.06em;
}
.entry-content ul, .entry-content ol { padding-left: 1.2em; }
.entry-content li + li { margin-top: .35em; }
.entry-content img {
	margin: 1.2em 0;
	border: 3px solid var(--ek-line);
}
.entry-content figure { margin-left: 0; margin-right: 0; }
.entry-content figcaption {
	font-family: var(--ek-font);
	font-size: 13px;
	font-weight: 800;
	color: var(--ek-muted);
	margin-top: 8px;
}
.entry-content pre, .entry-content code {
	font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;
	font-size: .82em;
	background: var(--ek-soft);
}
.entry-content pre { padding: 18px; overflow-x: auto; border: 3px solid var(--ek-line); }

.post-footer {
	max-width: var(--ek-text);
	margin-top: 40px;
	padding-top: 24px;
	border-top: 3px solid var(--ek-line);
}
.post-tags { display: flex; flex-wrap: wrap; gap: 8px; }
.post-tags a {
	border: 2px solid var(--ek-line);
	padding: 6px 8px;
	text-decoration: none;
	background: var(--ek-bg);
}
.post-tags a:hover { background: var(--ek-ink); color: var(--ek-bg); }

.author-band {
	max-width: var(--ek-max);
	margin: 60px auto 0;
	border-top: 3px solid var(--ek-line);
	padding-top: 24px;
	display: grid;
	grid-template-columns: 1fr 2fr;
	gap: 24px;
}
.author-band strong {
	display: block;
	font-size: clamp(34px, 5vw, 76px);
	line-height: .86;
	letter-spacing: -0.08em;
	font-weight: 1000;
	text-transform: uppercase;
}
.author-band p { margin: 0; color: var(--ek-muted); }

.site-footer {
	border-top: 3px solid var(--ek-line);
	padding: 28px var(--ek-pad);
}
.footer-inner {
	max-width: var(--ek-max);
	margin: 0 auto;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 18px;
	align-items: center;
}
.footer-title {
	font-size: 12px;
	font-weight: 1000;
	letter-spacing: .18em;
	text-transform: uppercase;
}
.footer-links { display: flex; gap: 12px; flex-wrap: wrap; justify-content: flex-end; }
.footer-links a { font-size: 12px; font-weight: 950; letter-spacing: .12em; text-transform: uppercase; }

.alignwide { max-width: 1000px; }
.alignfull { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: calc(50% - 50vw); }
.wp-caption { max-width: 100%; }
.gallery { display: grid; gap: 12px; }
.gallery-item { margin: 0; }

@media (max-width: 860px) {
	.header-inner, .footer-inner { grid-template-columns: 1fr; }
	.site-nav .menu, .footer-links { justify-content: flex-start; }
	.hero-rail { grid-template-columns: 1fr 1fr; }
	.post-card, .post-card:nth-child(1) { grid-column: span 12; }
	.post-card.has-thumb:nth-child(1) { display: flex; }
	.post-card:nth-child(1) .card-image { border-right: 0; border-bottom: 3px solid var(--ek-line); }
	.human-note-grid, .author-band { grid-template-columns: 1fr; }
	.search-form { grid-template-columns: 1fr; }
	.search-submit { border-left: 0; border-top: 3px solid var(--ek-line); padding: 14px; }
}

@media (prefers-reduced-motion: reduce) {
	html { scroll-behavior: auto; }
	*, *::before, *::after { animation-duration: .001ms !important; transition-duration: .001ms !important; }
}
