/* ============================================================
   World Wide Journals — "Scholarly Gazette" front page
   A bespoke editorial system: nameplate, front-page contents,
   column rules, rubricated initials, index typography.
   Standalone — used only by the new index.html.
   ============================================================ */
:root{
  --paper:#f5f0e3; --paper-2:#efe8d6; --ink:#1b1812; --ink-2:#403a2c;
  --muted:#736a52; --rule:#1b1812; --hair:#c7bda3; --hair-2:#ddd4bd;
  --rubric:#7d271b;          /* oxblood rubrication */
  --green:#10433a;           /* publisher ink-green, used sparingly */
  --gold:#9a6b14;
  --disp:"Fraunces",Georgia,"Times New Roman",serif;
  --read:"Newsreader",Georgia,serif;
  --sans:"Archivo",system-ui,sans-serif;
  --measure:66ch;
}
*,*::before,*::after{box-sizing:border-box}*{margin:0}
html{ -webkit-text-size-adjust:100%; }
body{
  font-family:var(--read); background:var(--paper); color:var(--ink);
  font-size:18px; line-height:1.5; -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility; font-feature-settings:"onum" 1,"liga" 1,"kern" 1;
  overflow-x:hidden;
}
body::before{ /* faint laid-paper texture */
  content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;opacity:.5;
  background:
    repeating-linear-gradient(0deg,transparent 0 3px,rgba(27,24,18,.012) 3px 4px),
    radial-gradient(120% 80% at 50% -10%,rgba(16,67,58,.05),transparent 60%);
}
img{display:block;max-width:100%}
a{color:inherit;text-decoration:none}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
ul,ol{list-style:none;padding:0}
:focus-visible{outline:2.5px solid var(--rubric);outline-offset:2px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;z-index:99;background:var(--ink);color:var(--paper);padding:10px 16px}

.sheet{width:min(100% - 2.6rem,1180px);margin-inline:auto}
.smallcaps{font-variant:small-caps;letter-spacing:.04em}
.rule{height:1px;background:var(--rule)}
.hair{height:1px;background:var(--hair)}

/* typographic helpers */
.label{font-family:var(--sans);font-size:.66rem;font-weight:700;letter-spacing:.24em;text-transform:uppercase;color:var(--muted)}
.kicker{font-family:var(--sans);font-size:.62rem;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--rubric)}
.asterism{ text-align:center;color:var(--rubric);font-family:var(--disp);font-size:1.1rem;letter-spacing:.5em;padding:.2rem 0 .1rem }

/* ---------- Folio (very top) ---------- */
.folio{ border-bottom:1px solid var(--hair); background:var(--paper-2) }
.folio .sheet{ display:flex;justify-content:space-between;align-items:center;gap:1rem;
  padding:.45rem 0;font-family:var(--sans);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted) }
.folio b{color:var(--ink);font-weight:700}
.folio .folio-r{display:flex;gap:1.4rem}
@media(max-width:680px){.folio .folio-r span:nth-child(2){display:none}}

/* ---------- Nameplate / masthead ---------- */
.nameplate{ padding:1.5rem 0 .2rem; text-align:center }
.nameplate .np-grid{ display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:1.4rem }
.np-side{ font-family:var(--disp);font-size:.82rem;line-height:1.3;color:var(--ink-2) }
.np-side.l{text-align:right}.np-side.r{text-align:left}
.np-side b{display:block;font-size:1.5rem;font-weight:600;color:var(--ink);font-variant-numeric:oldstyle-nums}
.np-side span{font-variant:small-caps;letter-spacing:.05em;color:var(--muted);font-family:var(--sans);font-size:.6rem;text-transform:uppercase}
.np-title{ font-family:var(--disp);font-weight:600;font-size:clamp(2.1rem,6.4vw,4.7rem);line-height:.9;
  letter-spacing:-.01em;color:var(--ink); font-optical-sizing:auto }
.np-title .amp{font-style:italic;color:var(--rubric);font-weight:500}
.np-motto{ font-family:var(--read);font-style:italic;font-size:1.02rem;color:var(--ink-2);margin-top:.7rem }
.np-motto b{ font-style:normal;font-variant:small-caps;letter-spacing:.06em;color:var(--rubric);font-weight:600 }
.np-rule{ position:relative;height:4px;margin:1rem 0 0 }
.np-rule::before{content:"";position:absolute;inset:0 0 auto;height:3px;border-top:1px solid var(--rule);border-bottom:1px solid var(--rule)}
@media(max-width:760px){ .nameplate .np-grid{grid-template-columns:1fr}.np-side{display:none} }

/* ---------- Gazette nav ---------- */
.gnav{ position:sticky;top:0;z-index:40;background:color-mix(in srgb,var(--paper) 92%,transparent);
  backdrop-filter:blur(6px); border-bottom:1px solid var(--rule); }
.gnav .sheet{ display:flex;align-items:center;justify-content:center;gap:0;flex-wrap:wrap }
.gnav a{ font-family:var(--disp);font-size:.9rem;font-weight:500;letter-spacing:.02em;
  padding:.7rem 1.15rem;color:var(--ink);position:relative;transition:color .2s }
.gnav a+a{ box-shadow:-1px 0 0 var(--hair) }
.gnav a:hover{ color:var(--rubric);background:var(--paper-2) }
.gnav .gnav-search{ margin-left:auto;display:flex;align-items:center;gap:.45rem;color:var(--muted);
  font-family:var(--sans);font-size:.7rem;letter-spacing:.14em;text-transform:uppercase;padding-left:1rem }
.gnav .gnav-search svg{width:15px;height:15px}
.gmenu-btn{ display:none }
@media(max-width:880px){
  .gnav .sheet{justify-content:space-between}
  .gnav-links{ display:none;position:absolute;top:100%;left:0;right:0;background:var(--paper);
    border-bottom:1px solid var(--rule);flex-direction:column }
  .gnav-links.open{display:flex}
  .gnav-links a{box-shadow:none;border-top:1px solid var(--hair);text-align:center;padding:.85rem}
  .gmenu-btn{display:inline-flex;align-items:center;gap:.5rem;padding:.7rem 0;font-family:var(--disp)}
  .gmenu-btn span{display:block;width:22px;height:2px;background:var(--ink);box-shadow:0 6px 0 var(--ink),0 -6px 0 var(--ink)}
  .gnav .gnav-search{margin-left:0;padding:.7rem 0}
}

/* ---------- Dateline ---------- */
.dateline{ border-bottom:1px solid var(--rule) }
.dateline .sheet{ display:flex;justify-content:space-between;flex-wrap:wrap;gap:.4rem 1.4rem;
  padding:.55rem 0;font-family:var(--sans);font-size:.66rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-2) }
.dateline .sheet > span{display:inline-flex;align-items:center;gap:.55rem}
.dateline .o{color:var(--rubric)}

/* ---------- Front page ---------- */
.front{ padding:2.2rem 0 1rem }
.front-grid{ display:grid;grid-template-columns:1fr 1px 2fr 1px 1.05fr;gap:0 2.1rem }
.front-grid > .vr{ background:var(--hair) }

/* left rail: across the network */
.rail .rail-h{ font-family:var(--disp);font-size:1.02rem;font-weight:600;padding-bottom:.5rem;
  border-bottom:2px solid var(--rule);margin-bottom:.7rem }
.netlist li{ padding:.7rem 0;border-bottom:1px solid var(--hair) }
.netlist a{display:grid;grid-template-columns:auto 1fr;gap:.7rem;align-items:baseline}
.netlist .nl-mark{ font-family:var(--disp);font-weight:600;font-size:.78rem;color:var(--paper);
  background:var(--ink);width:2.05rem;height:1.5rem;display:grid;place-items:center;letter-spacing:.02em }
.netlist .nl-name{ font-family:var(--read);font-size:1.02rem;line-height:1.2;color:var(--ink) }
.netlist .nl-meta{ grid-column:2;font-family:var(--sans);font-size:.66rem;letter-spacing:.1em;
  text-transform:uppercase;color:var(--muted);margin-top:.25rem }
.netlist a:hover .nl-name{color:var(--rubric)}
.rail .almanac{ margin-top:1.4rem;border-top:2px solid var(--rule);padding-top:.9rem }
.almanac dl{ display:grid;grid-template-columns:1fr 1fr;gap:.9rem 1rem }
.almanac dt{ grid-column:1/-1;font-family:var(--sans);font-size:.6rem;letter-spacing:.2em;text-transform:uppercase;color:var(--muted);margin-bottom:-.5rem }
.almanac .fig b{ font-family:var(--disp);font-weight:600;font-size:1.9rem;line-height:1;color:var(--green);font-variant-numeric:oldstyle-nums;display:block }
.almanac .fig span{ font-family:var(--sans);font-size:.62rem;letter-spacing:.12em;text-transform:uppercase;color:var(--muted) }

/* lead article */
.lead .kicker{ display:flex;align-items:center;gap:.6rem }
.lead .kicker::after{content:"";flex:1;height:1px;background:var(--rubric);opacity:.4}
.lead h1{ font-family:var(--disp);font-weight:600;font-size:clamp(1.9rem,3.6vw,3.05rem);line-height:1.02;
  letter-spacing:-.015em;margin:.6rem 0 .5rem }
.lead h1 a:hover{color:var(--rubric)}
.lead .byline{ font-family:var(--read);font-style:italic;font-size:1.02rem;color:var(--ink-2);margin-bottom:.2rem }
.lead .byline b{font-style:normal;font-variant:small-caps;letter-spacing:.04em}
.lead .standfirst{ font-family:var(--sans);font-size:.66rem;letter-spacing:.16em;text-transform:uppercase;
  color:var(--muted);display:flex;gap:.8rem;flex-wrap:wrap;margin:.5rem 0 1rem;padding-bottom:.9rem;border-bottom:1px solid var(--hair) }
.lead .standfirst .o{color:var(--rubric)}
.lead .body{ columns:2;column-gap:2rem;column-rule:1px solid var(--hair);font-size:1.02rem;line-height:1.58;color:var(--ink-2) }
.lead .body p{ margin-bottom:.9rem;text-align:justify;hyphens:auto }
.lead .body p:first-of-type::first-letter{
  float:left;font-family:var(--disp);font-weight:600;color:var(--rubric);
  font-size:3.5em;line-height:.72;padding:.06em .08em 0 0 }
.lead .more{ font-family:var(--disp);font-weight:500;color:var(--rubric);border-bottom:1px solid var(--rubric);
  padding-bottom:1px;display:inline-block;margin-top:.4rem }
.lead .more:hover{background:color-mix(in srgb,var(--rubric) 8%,transparent)}
.lead figure{margin:1.2rem 0 0}
.lead figure img{width:100%;aspect-ratio:16/8;object-fit:cover;filter:grayscale(.5) contrast(1.06) sepia(.12)}
.lead figcaption{font-family:var(--sans);font-size:.66rem;letter-spacing:.04em;color:var(--muted);
  padding:.45rem 0 0;border-top:1px solid var(--ink);margin-top:.4rem}

/* right rail: in this issue */
.contents .rail-h{ font-family:var(--disp);font-size:1.02rem;font-weight:600;padding-bottom:.5rem;
  border-bottom:2px solid var(--rule);margin-bottom:.2rem;display:flex;justify-content:space-between;align-items:baseline }
.contents .rail-h span{font-family:var(--sans);font-size:.6rem;letter-spacing:.14em;text-transform:uppercase;color:var(--muted)}
.toc li{ display:grid;grid-template-columns:1fr auto;gap:.4rem;align-items:baseline;
  padding:.62rem 0;border-bottom:1px solid var(--hair) }
.toc a{ font-family:var(--read);font-size:.98rem;line-height:1.22;color:var(--ink) }
.toc a:hover{color:var(--rubric)}
.toc .pg{ font-family:var(--disp);font-variant-numeric:oldstyle-nums;color:var(--muted);font-size:.86rem }
.toc .sub{ grid-column:1;font-family:var(--sans);font-size:.58rem;letter-spacing:.14em;text-transform:uppercase;color:var(--rubric);margin-top:.2rem }
.contents .ico-issue{ margin-top:1.2rem;border:1px solid var(--rule);padding:1rem;display:flex;gap:.9rem;align-items:center;background:var(--paper-2) }
.ico-issue .spine{ width:46px;height:64px;flex-shrink:0;background:linear-gradient(160deg,var(--green),#0a2c26);
  color:#e9dfc4;display:flex;flex-direction:column;justify-content:space-between;padding:.4rem .35rem;
  font-family:var(--disp);position:relative }
.ico-issue .spine b{font-size:.82rem}.ico-issue .spine i{font-style:italic;font-size:.58rem;color:#cdb87f}
.ico-issue .spine::after{content:"";position:absolute;left:0;right:0;bottom:0;height:3px;background:var(--gold)}
.ico-issue .ico-t b{font-family:var(--disp);font-size:1.05rem;display:block}
.ico-issue .ico-t span{font-family:var(--sans);font-size:.64rem;letter-spacing:.1em;text-transform:uppercase;color:var(--muted)}
.ico-issue .ico-t a{display:inline-block;margin-top:.35rem;font-family:var(--disp);color:var(--rubric);border-bottom:1px solid var(--rubric)}

@media(max-width:980px){
  .front-grid{grid-template-columns:1fr;gap:0}
  .front-grid > .vr{display:none}
  .rail,.contents{padding-top:1.6rem;margin-top:1.6rem;border-top:2px solid var(--rule)}
  .lead .body{columns:2}
}
@media(max-width:560px){ .lead .body{columns:1} .almanac dl{grid-template-columns:1fr 1fr} }

/* ---------- Directory of titles ---------- */
.directory{ padding:2.4rem 0 }
.sec-head{ display:flex;align-items:baseline;justify-content:space-between;gap:1rem;
  border-bottom:2px solid var(--rule);padding-bottom:.5rem;margin-bottom:.2rem }
.sec-head h2{ font-family:var(--disp);font-weight:600;font-size:clamp(1.4rem,2.4vw,2rem);letter-spacing:-.01em }
.sec-head .label{align-self:center}
.dir-row{ display:grid;grid-template-columns:auto 1fr auto;gap:1.4rem;align-items:center;
  padding:1.15rem .2rem;border-bottom:1px solid var(--hair) }
.dir-row .dir-mono{ font-family:var(--disp);font-weight:600;font-size:1.5rem;color:var(--paper);
  background:var(--ink);width:3.1rem;height:3.1rem;display:grid;place-items:center }
.dir-row.t-ijar .dir-mono{background:#1c6b62}
.dir-row.t-ijsr .dir-mono{background:#5b3f6b}
.dir-row.t-gjra .dir-mono{background:#3d4c92}
.dir-row.t-paripex .dir-mono{background:#9a6b14}
.dir-row .dir-name b{font-family:var(--disp);font-size:1.2rem;font-weight:600}
.dir-row .dir-name p{font-family:var(--read);color:var(--ink-2);font-size:.94rem}
.dir-row .dir-data{ display:flex;gap:1.6rem;align-items:center }
.dir-row .dir-data dl{text-align:right}
.dir-row .dir-data dt{font-family:var(--sans);font-size:.56rem;letter-spacing:.16em;text-transform:uppercase;color:var(--muted)}
.dir-row .dir-data dd{font-family:var(--disp);font-variant-numeric:oldstyle-nums;font-size:1rem;font-weight:600}
.dir-row .dir-go{ font-family:var(--disp);color:var(--rubric);white-space:nowrap;border-bottom:1px solid var(--rubric);padding-bottom:1px }
.dir-row:hover{background:var(--paper-2)}
@media(max-width:760px){
  .dir-row{grid-template-columns:auto 1fr;gap:1rem}
  .dir-row .dir-data{grid-column:2;justify-content:flex-start;flex-wrap:wrap;gap:1rem;margin-top:.2rem}
  .dir-row .dir-go{grid-column:2}
}

/* ---------- Subject index ---------- */
.subjects{ padding:2rem 0 2.4rem;border-top:1px solid var(--hair) }
.subj-cols{ columns:5;column-gap:2rem;margin-top:1rem }
.subj-cols a{ display:block;font-family:var(--read);font-size:.96rem;padding:.28rem 0;color:var(--ink-2);
  border-bottom:1px dotted var(--hair);break-inside:avoid }
.subj-cols a:hover{color:var(--rubric)}
.subj-cols a .n{ float:right;font-family:var(--sans);font-size:.64rem;color:var(--muted);font-variant-numeric:oldstyle-nums }
.subj-all{ margin-top:1.1rem;font-family:var(--disp);color:var(--rubric);border-bottom:1px solid var(--rubric);
  display:inline-block;padding-bottom:1px }
@media(max-width:980px){.subj-cols{columns:3}}
@media(max-width:560px){.subj-cols{columns:2}}

/* ---------- Editorial note / authors ---------- */
.colophon-note{ padding:2.6rem 0;border-top:2px solid var(--rule);border-bottom:1px solid var(--hair) }
.cn-grid{ display:grid;grid-template-columns:1.4fr 1fr;gap:3rem;align-items:start }
.cn-grid .cn-lead{ font-family:var(--read);font-size:1.32rem;line-height:1.5;color:var(--ink) }
.cn-grid .cn-lead::first-letter{ font-family:var(--disp);font-weight:600;color:var(--rubric);font-size:3em;float:left;line-height:.74;padding:.05em .08em 0 0 }
.cn-grid .cn-lead b{font-variant:small-caps;letter-spacing:.03em;font-weight:600}
.cn-steps{ font-family:var(--read) }
.cn-steps li{ display:grid;grid-template-columns:auto 1fr;gap:1rem;padding:.85rem 0;border-bottom:1px solid var(--hair) }
.cn-steps .rn{ font-family:var(--disp);font-weight:600;color:var(--rubric);font-size:1.1rem;font-variant-numeric:oldstyle-nums }
.cn-steps b{font-family:var(--disp);font-size:1.05rem}
.cn-steps p{color:var(--ink-2);font-size:.94rem}
.cn-cta{ margin-top:1.4rem;display:flex;gap:.9rem;flex-wrap:wrap }
.btn-ink{ font-family:var(--disp);font-weight:600;background:var(--ink);color:var(--paper);padding:.7rem 1.3rem;
  border:1px solid var(--ink);transition:background .2s,color .2s }
.btn-ink:hover{background:var(--rubric);border-color:var(--rubric)}
.btn-line{ font-family:var(--disp);font-weight:600;border:1px solid var(--ink);padding:.7rem 1.3rem;transition:.2s }
.btn-line:hover{background:var(--ink);color:var(--paper)}
@media(max-width:760px){.cn-grid{grid-template-columns:1fr;gap:1.8rem}}

/* ---------- Colophon footer ---------- */
.colophon{ background:var(--ink);color:#cfc6ad;padding:2.8rem 0 1.4rem;margin-top:0 }
.colophon a{color:#cfc6ad}.colophon a:hover{color:#fff}
.col-top{ display:grid;grid-template-columns:1.6fr repeat(3,1fr);gap:2.4rem }
.col-brand .pm{ font-family:var(--disp);font-weight:600;color:#f3ecd6;font-size:1.5rem;display:flex;align-items:center;gap:.6rem }
.col-brand .pm .mark{ width:34px;height:34px;border:1px solid #6f6750;display:grid;place-items:center;color:#e9dfc4;font-size:1.05rem }
.col-brand p{ font-family:var(--read);color:#a59c83;font-size:.94rem;margin-top:.8rem;max-width:34ch }
.colophon h4{ font-family:var(--sans);font-size:.62rem;letter-spacing:.2em;text-transform:uppercase;color:#8e856c;margin-bottom:.9rem }
.colophon .col-links a{ display:block;font-family:var(--read);padding:.26rem 0;font-size:.96rem }
.col-bottom{ border-top:1px solid #3a3526;margin-top:2.2rem;padding-top:1.2rem;display:flex;justify-content:space-between;
  flex-wrap:wrap;gap:.6rem;font-family:var(--sans);font-size:.66rem;letter-spacing:.08em;text-transform:uppercase;color:#8e856c }
@media(max-width:760px){.col-top{grid-template-columns:1fr 1fr;gap:1.6rem}}
@media(max-width:480px){.col-top{grid-template-columns:1fr}}

/* reveal on load */
@keyframes ink{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
.ink-in{animation:ink .7s ease both}
@media(prefers-reduced-motion:reduce){*{animation:none!important}}
