/* ============================================================
   DOHOMI — Article / reading stylesheet
   Shared by all Issue 001 pages
   ============================================================ */
:root{
  --ivory:#F4F0E8; --paper:#EDE7DB; --stone:#D9D1C2; --clay:#B9A48B;
  --olive:#6F7257; --olive-deep:#565841; --charcoal:#26241F; --ink:#1C1A16; --muted:#7C766A;
  --serif:"Fraunces", Georgia, serif;
  --read:"Newsreader", Georgia, serif;
  --sans:"Inter", system-ui, sans-serif;
  --mono:"IBM Plex Mono", ui-monospace, monospace;
  --s1:8px; --s2:16px; --s3:24px; --s4:40px; --s5:64px; --s6:96px; --s7:140px;
  --gutter:clamp(20px,5vw,80px);
  --bg:var(--ivory); --fg:var(--ink); --accent:var(--olive); --line:rgba(28,26,22,.16);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--fg);font-family:var(--read);font-size:20px;line-height:1.62;
  -webkit-font-smoothing:antialiased;
  background-image:radial-gradient(rgba(0,0,0,.018) 1px,transparent 1px);background-size:3px 3px;}
img,svg{display:block;max-width:100%}
/* DOHOMI house grade — one consistent warm-neutral tone across the whole publication */
img{filter:grayscale(.42) contrast(.92) brightness(1.02) sepia(.06)}
a{color:inherit}
.eyebrow{font-family:var(--mono);font-size:11px;letter-spacing:.22em;text-transform:uppercase;color:var(--muted)}

/* Nav */
nav.top{position:sticky;top:0;z-index:50;background:color-mix(in srgb,var(--bg) 88%,transparent);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.nav-in{max-width:1280px;margin:0 auto;padding:0 var(--gutter);display:flex;align-items:center;justify-content:space-between;height:72px}
.logo{font-family:var(--serif);font-weight:500;font-size:20px;letter-spacing:.34em;padding-left:.34em;text-decoration:none}
.nav-links{display:flex;gap:var(--s4);font-family:var(--sans);font-size:13px;letter-spacing:.04em}
.nav-links a{color:var(--muted);text-decoration:none;transition:color .2s}
.nav-links a:hover{color:var(--fg)}

/* Article shell */
.wrap{max-width:720px;margin:0 auto;padding:0 var(--gutter)}
.wrap-wide{max-width:1080px;margin:0 auto;padding:0 var(--gutter)}

/* Masthead of an article */
.art-head{padding:var(--s7) 0 var(--s5);text-align:center}
.art-head .dept{margin-bottom:var(--s3)}
.art-head h1{font-family:var(--serif);font-weight:300;font-size:clamp(36px,6vw,76px);line-height:1.05;letter-spacing:-.02em;margin:0 auto;max-width:18ch}
.art-head h1 em{font-style:italic;color:var(--accent)}
.art-head .dek{font-family:var(--read);font-size:22px;color:var(--muted);max-width:46ch;margin:var(--s4) auto 0;line-height:1.5}
.art-head .byline{margin-top:var(--s4);font-family:var(--mono);font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}

/* Cover */
.cover{margin:var(--s4) 0 var(--s6)}
.cover img,.cover svg{width:100%;display:block}
.cover figcaption{max-width:1080px;margin:var(--s1) auto 0;padding:0 var(--gutter);font-family:var(--mono);font-size:11px;color:var(--muted)}

/* Body */
.body{padding-bottom:var(--s7)}
.body p{margin:0 0 var(--s3)}
.body .lead:first-letter{font-family:var(--serif);font-weight:400;float:left;font-size:4.2em;line-height:.82;padding:6px 10px 0 0;color:var(--accent)}
.body h2{font-family:var(--serif);font-weight:400;font-size:clamp(24px,3.4vw,34px);letter-spacing:-.01em;margin:var(--s5) 0 var(--s2);line-height:1.15}
.body blockquote{margin:var(--s5) 0;padding:0;border:0;font-family:var(--serif);font-weight:300;font-style:italic;font-size:clamp(26px,3.6vw,38px);line-height:1.25;color:var(--accent);letter-spacing:-.01em}
.body em{font-style:italic}
.body hr{border:0;border-top:1px solid var(--line);margin:var(--s5) auto;width:60px}
.pull{font-family:var(--serif);font-size:1.05em}
.body .note{font-family:var(--mono);font-size:13px;color:var(--muted);letter-spacing:.02em}

/* Field notes list */
.notes-list{padding-bottom:var(--s7)}
.note-item{padding:var(--s5) 0;border-top:1px solid var(--line)}
.note-item .num{font-family:var(--mono);font-size:11px;color:var(--accent);letter-spacing:.15em}
.note-item h2{font-family:var(--serif);font-weight:300;font-size:clamp(26px,4vw,42px);letter-spacing:-.015em;margin:var(--s2) 0 var(--s3);line-height:1.1}
.note-item p{margin:0 0 var(--s2);max-width:62ch}

/* End matter */
.endcap{text-align:center;padding:var(--s5) 0;border-top:1px solid var(--line);font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
.more{padding:var(--s6) 0;border-top:1px solid var(--line)}
.more .eyebrow{display:block;margin-bottom:var(--s3)}
.more a{display:block;font-family:var(--serif);font-weight:300;font-size:clamp(24px,3vw,34px);letter-spacing:-.01em;text-decoration:none;color:var(--fg);margin-bottom:var(--s2)}
.more a:hover{color:var(--accent)}

/* Inline article figures */
.fig{margin:var(--s5) 0}
.fig img{width:100%;object-fit:cover}
.fig.wide img{aspect-ratio:16/9}
.fig.tall img{aspect-ratio:3/4}
.fig figcaption{margin-top:var(--s1);font-family:var(--mono);font-size:11px;letter-spacing:.02em;color:var(--muted)}
.fig figcaption .cred{display:block;margin-top:2px;opacity:.8}
.fig.bleed{margin-left:calc(50% - 50vw);margin-right:calc(50% - 50vw);width:100vw}
.fig.bleed img{max-height:70vh}
.fig.bleed figcaption{max-width:720px;margin-left:auto;margin-right:auto;padding:0 var(--gutter)}

/* Footer SVG motif band */
.foot-motif{max-width:1080px;margin:0 auto var(--s4);padding:0 var(--gutter)}
.foot-motif img{width:100%;display:block;opacity:.9}

/* Footer */
footer{padding:var(--s5) 0 var(--s4);border-top:1px solid var(--line)}
.foot-logo{font-family:var(--serif);font-size:clamp(48px,9vw,120px);font-weight:300;letter-spacing:.06em;margin:0 0 var(--s3);line-height:1;text-align:center}
.foot-base{display:flex;justify-content:space-between;flex-wrap:wrap;gap:var(--s2);font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.06em;padding-top:var(--s3);border-top:1px solid var(--line)}

@media(max-width:880px){
  body{font-size:18px}
  .nav-links{display:none}
  .art-head{padding:var(--s5) 0 var(--s4)}
}