/* GravenReachMedia — /journal (editorial organ) Extends legal.css (imported first in every journal page's , after styles.css) — reuses its header/footer strip and .legal-wrap column, and adds only what the index list and article body need. Same tokens, same restraint: no new framework, no card-grid blog look. */ /* ---------- index (journal.html) ---------- */ .journal-head{margin-bottom:clamp(40px,7vh,72px)} .journal-head h1{font-family:var(--didone);font-weight:900;font-size:clamp(34px,6vw,58px); line-height:1.02;letter-spacing:-.01em;margin-bottom:16px} .journal-dek{font-size:var(--fs-lede);line-height:1.5;color:var(--ink-2);max-width:52ch} .journal-list{display:flex;flex-direction:column} .journal-item{display:block;padding:clamp(24px,4vh,36px) 0;border-bottom:var(--rule)} .journal-item:first-child{border-top:var(--rule)} .journal-item-date{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.14em; text-transform:uppercase;color:var(--ember-700);display:block;margin-bottom:10px} .journal-item-title{font-family:var(--didone);font-weight:700;font-size:clamp(22px,3.2vw,32px); line-height:1.14;color:var(--ink);margin-bottom:10px;transition:color .15s ease} .journal-item:hover .journal-item-title{color:var(--ember-700)} .journal-item-standfirst{font-size:16px;line-height:1.55;color:var(--ink-2);max-width:60ch} /* ---------- article (journal/.html) ---------- */ .article-eyebrow{font-family:var(--mono);font-size:var(--fs-micro);letter-spacing:.22em; text-transform:uppercase;color:var(--ember-700);margin-bottom:18px} .article-title{font-family:var(--didone);font-weight:900;font-size:clamp(32px,5.6vw,54px); line-height:1.06;letter-spacing:-.01em;margin-bottom:20px} .article-meta{display:flex;flex-wrap:wrap;gap:6px 14px;align-items:center; font-family:var(--mono);font-size:12px;letter-spacing:.04em;color:var(--ink-3); padding-bottom:clamp(28px,4.5vh,44px);border-bottom:var(--rule);margin-bottom:clamp(28px,4.5vh,44px)} .article-meta .byline{color:var(--ink-2)} .article-body h2{font-family:var(--didone);font-weight:700;font-size:clamp(22px,3vw,30px); line-height:1.16;margin:clamp(32px,5vh,48px) 0 16px} .article-body p{font-size:16px;line-height:1.7;color:var(--ink-2);margin-bottom:18px;max-width:64ch} .article-body p b, .article-body p strong{color:var(--ink);font-weight:700} .article-body a{color:var(--ember-700);text-decoration:underline;text-underline-offset:3px} .article-body a:hover{color:var(--ember-500)} .article-body table{width:100%;max-width:64ch;border-collapse:collapse;margin:0 0 22px;font-size:14px} .article-body th,.article-body td{text-align:left;padding:8px 14px 8px 0;border-bottom:var(--rule); color:var(--ink-2)} .article-body th{font-family:var(--mono);font-size:11px;letter-spacing:.08em;text-transform:uppercase; color:var(--ink-3);font-weight:400} .article-body code{font-family:var(--mono);font-size:14px;background:var(--paper-2); padding:1px 6px;border-radius:2px;color:var(--ink)} .article-body ul, .article-body ol{margin:0 0 18px;padding-left:22px;max-width:64ch} .article-body li{font-size:16px;line-height:1.7;color:var(--ink-2);margin-bottom:6px} .article-footline{margin-top:clamp(36px,6vh,56px);padding-top:24px;border-top:var(--rule)} .article-footline a{color:var(--ember-700);text-decoration:underline;text-underline-offset:3px}