/*
Theme Name: East of Eden
Theme URI: https://eastofeden.blog
Author: East of Eden
Description: A modern newspaper-style theme for East of Eden — flat, grid-driven, mono-green accent, grayscale photography, Archivo type with a Pirata One nameplate.
Version: 1.0
Requires at least: 6.0
Requires PHP: 7.4
License: GPL v2 or later
Text Domain: east-of-eden
*/

:root{
  --bg:#ffffff;
  --text:#201e1d;
  --accent:#2f6b4f;
  --accent-deep:#1f4834;
  --mustard:#c9862e;
  --divider:#dcdbda;
}

*{box-sizing:border-box;}
html{-webkit-text-size-adjust:100%;}
body{margin:0;background:var(--bg);color:var(--text);font-family:'Archivo',sans-serif;text-wrap:pretty;line-height:1.5;}
img{max-width:100%;}
a{color:var(--text);text-decoration:none;}
a:hover{color:var(--accent-deep);}
::selection{background:color-mix(in srgb, var(--accent) 20%, transparent);}
h1,h2,h3,h4{font-family:'Archivo',sans-serif;font-weight:800;margin:0;}

.wrap{max-width:1200px;margin:0 auto;padding:0 40px 80px;}
.rule{height:2px;background:var(--divider);border:0;margin:0;}

.utility-bar{display:flex;justify-content:space-between;align-items:baseline;padding:10px 0;font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:color-mix(in srgb, var(--text) 60%, transparent);}

.masthead{padding:36px 0 20px;text-align:center;}
.nameplate{font-family:'Pirata One',serif;font-weight:400;font-size:clamp(64px,9vw,120px);line-height:.9;margin:16px 0 0;}
.nameplate a{color:var(--accent);}
.tagline{font-size:15px;letter-spacing:.1em;text-transform:uppercase;color:var(--mustard);margin:12px 0 0;}

/* Circular badge mark (family illustration), sitting above the wordmark */
.badge-mark{display:inline-block;}
.badge-mark img{
  width:clamp(80px,8vw,110px);height:clamp(80px,8vw,110px);
  border-radius:50%;object-fit:cover;
  border:2px dashed var(--text);padding:4px;
  display:block;margin:0 auto;
}
.badge-mark--compact{display:inline-block;vertical-align:middle;margin-right:12px;}
.badge-mark--compact img{width:56px;height:56px;padding:3px;}

.site-nav{display:flex;justify-content:space-between;align-items:center;gap:32px;padding:16px 0;border-top:2px solid var(--divider);border-bottom:2px solid var(--divider);flex-wrap:wrap;}
.site-nav ul{display:flex;gap:32px;list-style:none;margin:0;padding:0;font-size:14px;letter-spacing:.03em;text-transform:uppercase;font-weight:600;flex-wrap:wrap;}
.site-nav .current-cat > a{color:var(--accent-deep);}
.search-field{margin:0;}
.search-field input{border:2px solid var(--text);background:transparent;padding:8px 12px;font:14px 'Archivo',sans-serif;min-width:220px;}

.brand-link{display:inline-flex;align-items:center;gap:12px;}
.brand-link span{font-family:'Pirata One',serif;font-weight:400;font-size:clamp(44px,6vw,68px);color:var(--accent);}

.section-label{display:inline-block;font-size:13px;letter-spacing:.08em;text-transform:uppercase;font-weight:700;border-bottom:3px solid var(--accent);padding-bottom:4px;}

.author-intro{display:grid;grid-template-columns:120px 1fr;gap:32px;align-items:center;padding:32px 0;border-top:2px solid var(--divider);}
.author-intro img{width:120px;height:120px;border-radius:50%;object-fit:cover;}
.author-intro .name-row{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;}
.author-intro h2{font-size:20px;}
.author-intro .handle{font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:var(--accent-deep);}
.author-intro p{font-size:15.5px;line-height:1.6;margin:10px 0 0;max-width:70ch;color:color-mix(in srgb, var(--text) 78%, transparent);text-align:justify;}

.follow-strip{padding:28px 0 8px;}
.follow-strip .head{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:16px;}
.follow-strip .handle{font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:color-mix(in srgb, var(--text) 60%, transparent);}
.follow-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;}
.follow-grid img,.follow-grid .ph{width:100%;aspect-ratio:1/1;object-fit:cover;filter:grayscale(1);display:block;background:color-mix(in srgb, var(--text) 8%, transparent);}

.hero-grid{display:grid;grid-template-columns:minmax(0,7fr) minmax(0,5fr);gap:56px;padding:48px 0;align-items:start;}
.hero-figure{margin:0 0 20px;border:2px solid var(--divider);padding:6px;}
.hero-figure img{width:100%;aspect-ratio:16/10;object-fit:cover;filter:grayscale(1);display:block;}
.tag-pill{display:inline-block;font-size:12px;letter-spacing:.04em;text-transform:uppercase;padding:4px 10px;background:var(--accent);color:var(--bg);}
.hero-grid h2{font-size:clamp(32px,4vw,46px);line-height:1.08;letter-spacing:-.015em;margin:14px 0 0;}
.dek{font-size:19px;line-height:1.6;margin:14px 0 0;color:color-mix(in srgb, var(--text) 78%, transparent);text-align:justify;}
.byline{display:flex;gap:10px;margin-top:20px;font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:color-mix(in srgb, var(--text) 65%, transparent);}
.byline strong{color:var(--text);}

.more-list .item{display:grid;grid-template-columns:32px 1fr;gap:16px;padding:16px 0;border-top:2px solid var(--divider);}
.more-list .item:last-child{border-bottom:2px solid var(--divider);}
.more-list .num{font-family:'Archivo',sans-serif;font-weight:800;font-size:14px;color:var(--accent);}
.more-list .cat{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:color-mix(in srgb, var(--text) 60%, transparent);}
.more-list h3{font-size:18px;line-height:1.3;margin:6px 0 0;}

.category-section{padding:44px 0 0;}
.category-head{display:flex;justify-content:space-between;align-items:baseline;border-top:2px solid var(--divider);padding-top:36px;}
.category-head h2{font-size:24px;text-transform:uppercase;letter-spacing:.01em;}
.category-head .view-all{font-size:13px;letter-spacing:.05em;text-transform:uppercase;color:var(--accent-deep);}
.post-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:40px;margin-top:28px;}
.post-card figure{margin:0 0 14px;border:2px solid var(--divider);padding:5px;}
.post-card img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:grayscale(1);display:block;}
.post-card h3{font-size:20px;line-height:1.3;letter-spacing:-.005em;}
.post-card p{font-size:14.5px;line-height:1.55;margin:10px 0 0;color:color-mix(in srgb, var(--text) 75%, transparent);text-align:justify;}
.post-card .meta{display:flex;gap:8px;margin-top:12px;font-size:12px;letter-spacing:.03em;text-transform:uppercase;color:color-mix(in srgb, var(--text) 60%, transparent);}

.quotes{padding:16px 0 40px;border-top:2px solid var(--divider);}
.quotes .grid{display:grid;grid-template-columns:repeat(2,1fr);gap:32px;margin-top:24px;}
blockquote.pull{margin:0;padding-left:20px;border-left:4px solid var(--accent);font-family:'Archivo',sans-serif;font-weight:800;font-size:19px;line-height:1.4;}
blockquote.pull footer{font-family:'Archivo',sans-serif;font-weight:400;font-size:13px;letter-spacing:.03em;text-transform:uppercase;color:color-mix(in srgb, var(--text) 60%, transparent);margin-top:12px;}

.newsletter{background:var(--accent);color:var(--bg);}
.newsletter .wrap{padding:56px 40px;display:flex;justify-content:space-between;align-items:center;gap:40px;flex-wrap:wrap;}
.newsletter h3{font-size:clamp(26px,3vw,36px);letter-spacing:-.01em;}
.newsletter p{font-size:15px;line-height:1.5;margin:10px 0 0;max-width:44ch;opacity:.9;}
.newsletter form{display:flex;gap:12px;flex-wrap:wrap;}
.newsletter input{background:var(--bg);border:2px solid var(--bg);padding:10px 14px;font:14px 'Archivo',sans-serif;min-width:240px;}
.newsletter button{background:transparent;border:2px solid var(--bg);color:var(--bg);padding:10px 20px;font:600 14px 'Archivo',sans-serif;text-transform:uppercase;letter-spacing:.03em;cursor:pointer;}
.newsletter button:hover{background:color-mix(in srgb, var(--bg) 15%, transparent);}

.site-footer{max-width:1200px;margin:0 auto;padding:32px 40px;}
.site-footer .row{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:16px;}
.site-footer nav{display:flex;gap:24px;font-size:13px;letter-spacing:.03em;text-transform:uppercase;color:color-mix(in srgb, var(--text) 65%, transparent);}

.article-wrap{max-width:760px;margin:0 auto;padding-top:48px;}
.article-wrap h1{font-size:clamp(34px,5vw,56px);line-height:1.06;letter-spacing:-.015em;margin:20px 0 0;}
.article-wrap .dek{font-style:italic;font-size:20px;text-align:left;margin:16px 0 0;}
.article-byline{display:flex;gap:12px;flex-wrap:wrap;margin-top:24px;padding-top:20px;border-top:2px solid var(--divider);font-size:13px;letter-spacing:.04em;text-transform:uppercase;color:color-mix(in srgb, var(--text) 65%, transparent);}
.article-hero{margin:32px 0 0;border:2px solid var(--divider);padding:6px;}
.article-hero img{width:100%;aspect-ratio:16/9;object-fit:cover;filter:grayscale(1);display:block;}
.article-body{font-size:18px;line-height:1.75;margin-top:32px;max-width:68ch;text-align:justify;}
.article-body p{margin:0 0 22px;}
.article-body blockquote{margin:32px 0;padding-left:24px;border-left:4px solid var(--accent);font-weight:800;font-size:24px;line-height:1.4;text-align:left;}
.tag-outline{display:inline-block;font-size:12px;letter-spacing:.04em;text-transform:uppercase;padding:4px 10px;border:2px solid var(--text);margin-right:8px;}
.author-bio{display:grid;grid-template-columns:80px 1fr;gap:20px;align-items:start;margin-top:48px;padding:28px 0;border-top:2px solid var(--divider);border-bottom:2px solid var(--divider);}
.author-bio img{width:80px;height:80px;border-radius:50%;object-fit:cover;}
.author-bio p{font-size:14.5px;line-height:1.6;margin:8px 0 0;color:color-mix(in srgb, var(--text) 75%, transparent);max-width:56ch;}
.related{max-width:960px;margin:0 auto;padding-top:48px;}
.related .grid{display:grid;grid-template-columns:repeat(3,1fr);gap:32px;}
.related figure{margin:0 0 12px;border:2px solid var(--divider);padding:5px;}
.related img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:grayscale(1);display:block;}
.related h4{font-size:17px;line-height:1.3;}
.related .date{font-size:12px;letter-spacing:.03em;text-transform:uppercase;color:color-mix(in srgb, var(--text) 60%, transparent);margin-top:8px;}

.cat-head{padding:44px 0 0;border-bottom:2px solid var(--divider);padding-bottom:24px;}
.cat-head h1{font-size:clamp(38px,5vw,60px);letter-spacing:-.015em;margin:0;}
.cat-head p{font-size:16px;line-height:1.5;margin:14px 0 0;max-width:56ch;color:color-mix(in srgb, var(--text) 75%, transparent);}
.cat-list .row{display:grid;grid-template-columns:220px 1fr;gap:32px;padding:32px 0;border-bottom:2px solid var(--divider);align-items:start;}
.cat-list figure{margin:0;border:2px solid var(--divider);padding:5px;}
.cat-list img{width:100%;aspect-ratio:4/3;object-fit:cover;filter:grayscale(1);display:block;}
.cat-list h2{font-size:26px;line-height:1.2;letter-spacing:-.01em;}
.cat-list p{font-size:15.5px;line-height:1.6;margin:12px 0 0;color:color-mix(in srgb, var(--text) 78%, transparent);max-width:64ch;text-align:justify;}
.pagination{display:flex;justify-content:center;gap:10px;padding-top:40px;}
.pagination .page-numbers{min-width:40px;height:40px;display:flex;align-items:center;justify-content:center;border:2px solid var(--text);text-decoration:none;color:var(--text);font-size:14px;}
.pagination .current{background:var(--text);color:var(--bg);}

@media (max-width:900px){
  .hero-grid{grid-template-columns:1fr;}
  .post-grid{grid-template-columns:1fr 1fr;}
  .follow-grid{grid-template-columns:repeat(2,1fr);}
  .quotes .grid{grid-template-columns:1fr;}
  .cat-list .row{grid-template-columns:1fr;}
}
@media (max-width:600px){
  .post-grid{grid-template-columns:1fr;}
  .site-nav{flex-direction:column;align-items:flex-start;}
  .author-intro{grid-template-columns:1fr;text-align:center;}
  .author-intro img{margin:0 auto;}
}

/*
 * Migrated post content carries inline font-family styles from years
 * of copy-pasting out of Word/Google Docs (Helvetica, etc.), and core
 * Gutenberg block-library CSS sets its own font stack on some block
 * types too. Force the theme's Archivo everywhere inside article
 * content so the site reads as one consistent typeface regardless of
 * what any individual post's markup says.
 */
.article-body, .article-body * { font-family: 'Archivo', sans-serif !important; }
.article-body h1, .article-body h2, .article-body h3,
.article-body h4, .article-body h5, .article-body h6,
.article-body blockquote { font-weight: 800; }