/*
Theme Name: ERIC KIM AI First
Theme URI: https://erickimphotography.com/blog/
Author: ERIC KIM
Author URI: https://erickimphotography.com/
Description: Ultra-fast, photography-first, human-artist WordPress theme with semantic HTML, machine-readable publishing metadata, no external fonts, and no theme JavaScript.
Version: 1.0.0
Requires at least: 6.5
Requires PHP: 7.4
License: GNU General Public License v2 or later
License URI: https://www.gnu.org/licenses/gpl-2.0.html
Text Domain: erickim-ai-first
Tags: blog, photography, one-column, custom-logo, featured-images, accessibility-ready
*/

:root {
  --ink: #050505;
  --paper: #fff;
  --muted: #626262;
  --line: #d8d8d8;
  --accent: #e00000;
  --measure: 760px;
  --wide: 1180px;
  --pad: clamp(18px, 4vw, 52px);
}

* { box-sizing: border-box; }
html { font-size: 100%; scroll-behavior: auto; }
body {
  margin: 0;
  color: var(--ink);
  background: var(--paper);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Helvetica, Arial, sans-serif;
  font-size: clamp(18px, 1.45vw, 21px);
  line-height: 1.58;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

img, picture, video, iframe { max-width: 100%; height: auto; }
figure { margin: 2.2rem 0; }
figcaption { margin-top: .55rem; color: var(--muted); font-size: .78em; }

a { color: inherit; text-decoration-thickness: .08em; text-underline-offset: .16em; }
a:hover, a:focus-visible { color: var(--accent); }
:focus-visible { outline: 3px solid var(--accent); outline-offset: 3px; }

h1, h2, h3, h4, h5, h6 {
  margin: 1.7em 0 .55em;
  line-height: .99;
  letter-spacing: -.035em;
  font-weight: 900;
}
h1 { font-size: clamp(2.8rem, 9vw, 7.5rem); }
h2 { font-size: clamp(2rem, 5vw, 4.25rem); }
h3 { font-size: clamp(1.45rem, 3vw, 2.5rem); }
p, ul, ol, blockquote, pre, table { margin: 0 0 1.35em; }
blockquote { margin-left: 0; padding-left: 1em; border-left: 6px solid var(--ink); font-size: 1.25em; font-weight: 700; }
hr { border: 0; border-top: 2px solid var(--ink); margin: 3rem 0; }
code, pre, kbd, samp { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; }
pre { overflow-x: auto; padding: 1rem; border: 1px solid var(--line); font-size: .82em; }

.screen-reader-text {
  position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0,0,0,0); white-space: nowrap; border: 0;
}
.screen-reader-text:focus { position: fixed !important; top: 12px; left: 12px; z-index: 99999; width: auto; height: auto; padding: .8rem 1rem; clip: auto; background: #fff; color: #000; font-weight: 800; }

.site-header { border-bottom: 2px solid var(--ink); }
.header-inner { max-width: var(--wide); margin: 0 auto; padding: 18px var(--pad) 16px; }
.brand-row { display: flex; gap: 18px; align-items: baseline; justify-content: space-between; flex-wrap: wrap; }
.site-branding a { text-decoration: none; }
.site-title { margin: 0; font-size: clamp(1.55rem, 4vw, 2.55rem); letter-spacing: -.055em; font-weight: 1000; }
.site-description { margin: 4px 0 0; color: var(--muted); font-size: .72em; font-weight: 750; letter-spacing: .02em; }
.custom-logo { display: block; max-height: 60px; width: auto; }

.primary-nav { margin-top: 15px; }
.primary-nav ul { display: flex; flex-wrap: wrap; gap: 8px 22px; margin: 0; padding: 0; list-style: none; }
.primary-nav a { font-size: .72em; font-weight: 900; letter-spacing: .055em; text-decoration: none; text-transform: uppercase; }

.site-main { min-height: 70vh; }
.hero { max-width: var(--wide); margin: 0 auto; padding: clamp(36px, 8vw, 90px) var(--pad) clamp(30px, 7vw, 72px); border-bottom: 2px solid var(--ink); }
.hero-kicker { margin: 0 0 16px; font-size: .75em; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.hero-title { max-width: 1050px; margin: 0; font-size: clamp(3.7rem, 14vw, 10.5rem); line-height: .78; letter-spacing: -.075em; text-transform: uppercase; }
.hero-copy { max-width: 780px; margin: 28px 0 0; font-size: clamp(1.05rem, 2vw, 1.45rem); font-weight: 750; line-height: 1.35; }
.hero-mantra { display: flex; flex-wrap: wrap; gap: 10px 22px; margin: 26px 0 0; padding: 0; list-style: none; font-size: .73em; font-weight: 950; letter-spacing: .04em; text-transform: uppercase; }

.search-form { display: flex; max-width: 760px; margin-top: 30px; border: 2px solid var(--ink); }
.search-form label { flex: 1; }
.search-field { width: 100%; min-height: 52px; padding: 10px 14px; border: 0; background: transparent; color: var(--ink); font: inherit; }
.search-submit { border: 0; border-left: 2px solid var(--ink); padding: 0 18px; background: var(--ink); color: #fff; font: inherit; font-size: .74em; font-weight: 950; text-transform: uppercase; cursor: pointer; }
.search-submit:hover, .search-submit:focus-visible { background: var(--accent); }

.loop, .archive-header, .single-wrap, .page-wrap, .not-found { max-width: var(--wide); margin: 0 auto; padding-left: var(--pad); padding-right: var(--pad); }
.loop { padding-top: 0; }
.archive-header { padding-top: 50px; padding-bottom: 30px; border-bottom: 2px solid var(--ink); }
.archive-title { margin: 0; font-size: clamp(2.5rem, 7vw, 6rem); text-transform: uppercase; }
.archive-description { max-width: var(--measure); margin-top: 18px; color: var(--muted); }

.post-card { padding: clamp(34px, 6vw, 70px) 0; border-bottom: 2px solid var(--ink); content-visibility: auto; contain-intrinsic-size: 700px; }
.post-card-media { display: block; margin: 0 0 clamp(24px, 4vw, 42px); }
.post-card-media img { display: block; width: 100%; max-height: 78vh; object-fit: cover; }
.eyebrow, .entry-meta { color: var(--muted); font-size: .68em; font-weight: 850; letter-spacing: .045em; text-transform: uppercase; }
.post-card-title { max-width: 1050px; margin: 9px 0 14px; font-size: clamp(2.25rem, 6vw, 5.8rem); }
.post-card-title a { text-decoration: none; }
.post-card-excerpt { max-width: 790px; font-size: 1.02em; }
.read-more { font-size: .78em; font-weight: 950; text-transform: uppercase; }

.pagination { max-width: var(--wide); margin: 0 auto; padding: 38px var(--pad) 56px; }
.nav-links { display: flex; gap: 10px 18px; flex-wrap: wrap; align-items: center; }
.page-numbers { font-weight: 850; }

.single-wrap, .page-wrap { padding-top: clamp(40px, 8vw, 92px); padding-bottom: 90px; }
.entry-header { max-width: 1080px; margin-bottom: 40px; }
.entry-title { margin: 10px 0 16px; overflow-wrap: anywhere; }
.entry-deck { max-width: var(--measure); color: var(--muted); font-size: 1.12em; }
.hero-image { width: min(100% + 0px, var(--wide)); margin: 0 0 clamp(38px, 7vw, 70px); }
.hero-image img { display: block; width: 100%; max-height: 88vh; object-fit: contain; background: #f4f4f4; }
.entry-content { max-width: var(--measure); }
.entry-content > :first-child { margin-top: 0; }
.entry-content h2, .entry-content h3 { scroll-margin-top: 24px; }
.entry-content img { display: block; }
.entry-content .alignwide { width: min(var(--wide), calc(100vw - (2 * var(--pad)))); max-width: none; margin-left: 50%; transform: translateX(-50%); }
.entry-content .alignfull { width: 100vw; max-width: none; margin-left: 50%; transform: translateX(-50%); }
.entry-content table { width: 100%; border-collapse: collapse; font-size: .9em; }
.entry-content th, .entry-content td { padding: 8px 10px; border: 1px solid var(--line); text-align: left; vertical-align: top; }
.entry-footer { max-width: var(--measure); margin-top: 55px; padding-top: 22px; border-top: 2px solid var(--ink); font-size: .8em; }
.post-nav { max-width: var(--measure); margin-top: 45px; padding-top: 24px; border-top: 1px solid var(--line); }
.post-nav .nav-links { justify-content: space-between; }
.post-nav a { font-weight: 900; }

.page-wrap .entry-content { max-width: 900px; }
.not-found { padding-top: 70px; padding-bottom: 100px; }

.site-footer { border-top: 2px solid var(--ink); }
.footer-inner { max-width: var(--wide); margin: 0 auto; padding: 34px var(--pad) 45px; display: flex; justify-content: space-between; gap: 18px; flex-wrap: wrap; font-size: .7em; font-weight: 800; }
.footer-nav { display: flex; flex-wrap: wrap; gap: 8px 16px; margin: 0; padding: 0; list-style: none; }
.footer-nav a { text-decoration: none; }

.wp-caption, .gallery-caption { color: var(--muted); }
.sticky { border-top: 7px solid var(--ink); }
.bypostauthor { font-weight: inherit; }

@media (max-width: 700px) {
  body { line-height: 1.52; }
  .hero-title { font-size: clamp(3.3rem, 20vw, 7rem); }
  .post-card { contain-intrinsic-size: 540px; }
  .entry-content .alignwide, .entry-content .alignfull { width: calc(100vw - 1px); }
  .search-submit { padding-inline: 13px; }
}

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

@media print {
  .site-header, .site-footer, .post-nav, .search-form { display: none !important; }
  body { font-size: 12pt; color: #000; background: #fff; }
  a { color: #000; text-decoration: none; }
  .single-wrap, .page-wrap { max-width: none; padding: 0; }
  .entry-content { max-width: none; }
}