/* ============================================================================
   Star Heartsong — "Quiet Field", conscious system.
   Every value below is answerable. Three ladders, each with a stated job:
   one TYPE scale, one SPACE rhythm, one INK ladder. Nothing off-ladder.
   ============================================================================ */
:root{
  /* —— INK: one warm-black ladder. Four steps, four jobs. —— */
  --ink:#171511;      /* titles & primary text — rich near-black      */
  --ink-2:#2b2823;    /* reading body (poems, prose, the bridge)      */
  --ink-3:#4d4a43;    /* meta, captions, intros                       */
  --ink-4:#6b675e;    /* labels at rest, wayfinding                    */
  --line:#cfccc1;     /* hairlines — the only divider on the site     */
  --bg:#ECEAE5;       /* warm limestone ground (provenance: Noguchi)  */
  --accent:#8C2F2A;   /* the ONE rationed brick-red (SFZC). Reserved  */
  --accent-deep:#6e231f;

  /* —— TYPE: six sizes. Each maps to exactly one role. A harmonic
        progression that tightens as it descends (dramatic at the top
        where contrast is the point, subtle in text where calm is).   */
  --t-display:4.25rem;   /* 68px — the hero thesis, once, the loudest voice */
  --t-1:2.625rem;        /* 42px — page & poem titles                 */
  --t-2:1.6875rem;       /* 27px — listing & feature titles           */
  --t-read:1.25rem;      /* 20px — ALL reading text + intros          */
  --t-ui:0.9375rem;      /* 15px — meta, secondary, captions          */
  --t-micro:0.75rem;     /* 12px — tracked uppercase labels (optically small) */

  /* —— SPACE: one 8px rhythm. Every margin & pad is a rung. —— */
  --s1:0.5rem; --s2:1rem; --s3:1.5rem; --s4:2.5rem; --s5:4rem; --s6:6rem; --s7:8rem;

  --serif:'EB Garamond',Georgia,serif;
  --sans:'Hanken Grotesk',system-ui,sans-serif;
  --measure:34rem; /* ~66 characters: the reading line                */
}
*{margin:0;padding:0;box-sizing:border-box}
html{font-size:100%}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-size:var(--t-ui);line-height:1.5;-webkit-font-smoothing:antialiased;overflow-x:hidden}
.eb{font-family:var(--serif)}
a{color:inherit}

/* —— ONE label treatment for all wayfinding/meta: micro caps, recessive.
      Brick is NEVER a label colour; it is reserved for four accent moments. */
.label{font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-4);font-weight:500}

.wrap{max-width:71rem;margin:0 auto;padding:0 var(--s5)}
.min0>*{min-width:0}

/* ---- header / nav ---- */
.nav{display:flex;justify-content:space-between;align-items:baseline;gap:var(--s2);flex-wrap:wrap;max-width:71rem;margin:0 auto;padding:var(--s3) var(--s5)}
.seal{font-family:var(--serif);font-style:italic;font-size:1.45rem;color:var(--accent);text-decoration:none}  /* accent moment 1: the name */
.nav-links{display:flex;flex-wrap:wrap;gap:var(--s3);font-size:var(--t-micro);letter-spacing:.18em;text-transform:uppercase}
.nav-links a{text-decoration:none;color:var(--ink-4);transition:color .2s}
.nav-links a:hover,.nav-links a.on{color:var(--accent)}                                                       /* accent moment 2: where you are */

/* ---- homepage hero: the WORD is the architecture ---- */
.hero{border-top:1px solid var(--line);padding-top:var(--s5)}
.hero .eyebrow{margin-bottom:var(--s3)}
.thesis{font-family:var(--serif);font-size:var(--t-display);line-height:1.0;letter-spacing:-.015em;font-weight:500;max-width:14ch}
.thesis em{font-style:italic;color:var(--accent)}                                                             /* accent moment 3: the payload word */
.hero-row{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,auto);gap:var(--s5);align-items:start;margin-top:var(--s4)}
.bridge{font-family:var(--serif);font-size:var(--t-read);line-height:1.6;color:var(--ink-2);max-width:38ch}
.portrait{width:19rem;max-width:100%;aspect-ratio:4/5;object-fit:cover;object-position:50% 28%;display:block;border:1px solid var(--line);filter:saturate(1.08) contrast(1.05)}
.pcap{font-family:var(--serif);font-style:italic;font-size:var(--t-ui);color:var(--ink-3);margin-top:var(--s1)}

/* ---- the breath (poetry pause) ---- */
.breath{padding:var(--s7) 0;margin-top:var(--s6);border-top:1px solid var(--line);border-bottom:1px solid var(--line);text-align:center}
.breath p{font-family:var(--serif);font-style:italic;font-size:var(--t-2);line-height:1.5;color:var(--ink-2);max-width:24ch;margin:0 auto}
.breath .attr{font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-top:var(--s3)} /* accent moment 4: the poem's name */
.breath .attr a{text-decoration:none;color:inherit}

/* ---- homepage collection ---- */
.collection{padding:var(--s5) 0 0}
.col-head{margin-bottom:var(--s4)}
.grid{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr) minmax(0,1fr);gap:var(--s5)}
.sec{margin-bottom:var(--s4)}
.sec h2{font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-4);font-weight:500;margin-bottom:var(--s2);padding-bottom:var(--s1);border-bottom:1px solid var(--line)}
.sec a{display:block;text-decoration:none;color:var(--ink);margin-bottom:var(--s2)}
.sec a .t{font-family:var(--serif);font-size:var(--t-read);line-height:1.22;display:block}
.feat a .t{font-size:var(--t-2)}
.sec a small{display:block;font-size:var(--t-micro);color:var(--ink-4);letter-spacing:.02em;margin-top:2px;text-transform:none}
.sec a.more .t{color:var(--accent)}

/* ---- inner page header ---- */
.page-head{padding:var(--s5) 0 var(--s4);border-top:1px solid var(--line)}
.page-head .eyebrow{margin-bottom:var(--s2)}
.page-head h1{font-family:var(--serif);font-weight:500;font-size:var(--t-1);line-height:1.08;letter-spacing:-.012em}
.page-head h1 em{font-style:italic;color:var(--accent)}
.page-head .intro{font-family:var(--serif);font-size:var(--t-read);line-height:1.55;color:var(--ink-3);max-width:46ch;margin-top:var(--s3)}

/* ---- listing (papers · talks · press · projects) ---- */
.listing{padding:var(--s1) 0 var(--s4)}
.item{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s4);align-items:baseline;padding:var(--s3) 0;border-top:1px solid var(--line)}
.item:last-child{border-bottom:1px solid var(--line)}
.item .lab{font-size:var(--t-micro);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-4);margin-bottom:var(--s1)}
.item .t{font-family:var(--serif);font-size:var(--t-2);line-height:1.18;font-weight:400}
.item a.t{text-decoration:none}
.item .m{font-size:var(--t-ui);color:var(--ink-3);margin-top:var(--s1);line-height:1.5}
.item .v{font-size:var(--t-micro);letter-spacing:.06em;text-transform:uppercase;color:var(--accent);white-space:nowrap;padding-top:6px}
.item .v a{text-decoration:none}
.item .v span{color:var(--ink-4);margin:0 6px}
.group-label{font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-4);font-weight:500;margin:var(--s5) 0 0}

/* ---- homepage "featured in" press band (quiet credibility, single row) ---- */
.featured{border-top:1px solid var(--line);margin-top:var(--s6);padding:var(--s6) 0}
.featured-label{text-align:center;font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-4);margin-bottom:var(--s4)}
.featured-logos{display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:var(--s5)}
.featured-logos a{display:block;line-height:0}
.featured-logos img{display:block;width:auto;filter:brightness(0) opacity(.5);transition:opacity .25s}
.featured-logos a:hover img{opacity:.78}
@media(max-width:760px){.featured{padding:var(--s5) 0}.featured-logos{flex-wrap:wrap;gap:var(--s3) var(--s5)}}

/* ---- press page: per-clipping rows (the logo IS the label — no redundancy) ---- */
.cliplist{padding:var(--s1) 0 var(--s4)}
.clip{display:grid;grid-template-columns:152px minmax(0,1fr);gap:var(--s4);align-items:center;padding:var(--s4) 0;border-top:1px solid var(--line)}
.clip:last-child{border-bottom:1px solid var(--line)}
.clip-logo{display:flex;align-items:center;min-height:34px}
.clip-logo img{max-width:140px;max-height:32px;width:auto;height:auto;object-fit:contain;filter:brightness(0) opacity(.62)}
.clip .t{font-family:var(--serif);font-size:var(--t-2);line-height:1.18;font-weight:400}
.clip .m{font-size:var(--t-ui);color:var(--ink-3);margin-top:5px;letter-spacing:.01em}
@media(max-width:760px){.clip{grid-template-columns:1fr;gap:var(--s2);padding:var(--s3) 0}.clip-logo img{max-height:28px}}

/* ---- reading column (poems · about) ---- */
.read{max-width:var(--measure);margin:0 auto;padding:var(--s3) 0}
.poem h1{font-family:var(--serif);font-size:var(--t-1);font-weight:500;line-height:1.1;margin-bottom:var(--s1)}
.poem .pmeta{font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-4);margin-bottom:var(--s4)}
.poem .body{font-family:var(--serif);font-size:var(--t-read);line-height:1.62;color:var(--ink-2)}
.poem .body p{margin-bottom:var(--s3)}
.poem .sig{font-family:var(--serif);font-style:italic;font-size:var(--t-read);color:var(--accent);margin-top:var(--s4)}
.prose{font-family:var(--serif);font-size:var(--t-read);line-height:1.66;color:var(--ink-2)}
.prose p{margin-bottom:var(--s3)}
.prose h2{font-family:var(--sans);font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-4);font-weight:500;margin:var(--s5) 0 var(--s2)}
.prose em{font-style:italic;color:var(--accent)}
.prose .portrait{float:right;width:17rem;margin:0 0 var(--s3) var(--s4)}

/* ---- the arc (year-by-year timeline) ---- */
.arc{margin-top:var(--s5);padding-top:var(--s4);border-top:1px solid var(--line)}
.arc h2{font-family:var(--sans);font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-4);font-weight:500;margin-bottom:var(--s3)}
.arc-row{display:grid;grid-template-columns:4.25rem 1fr;gap:var(--s3);padding:var(--s2) 0;border-top:1px solid var(--line)}
.arc-row:first-of-type{border-top:none}
.arc-year{font-family:var(--serif);font-size:var(--t-2);color:var(--accent);line-height:1.05}
.arc-delta{font-family:var(--serif);font-size:var(--t-read);line-height:1.42;color:var(--ink-2)}
.arc-delta em{font-style:italic;color:var(--accent)}
@media(max-width:760px){.arc-row{grid-template-columns:1fr;gap:4px;padding:var(--s2) 0}}

/* ---- poem index ---- */
.poemlist{padding:0 0 var(--s4)}
.poemlist a{display:block;text-decoration:none;color:var(--ink);padding:var(--s3) 0;border-top:1px solid var(--line)}
.poemlist a:last-child{border-bottom:1px solid var(--line)}
.poemlist a .t{font-family:var(--serif);font-size:var(--t-2);line-height:1.2}
.poemlist a .m{font-size:var(--t-micro);color:var(--ink-4);letter-spacing:.02em;margin-top:2px;text-transform:uppercase}
.poemlist a:hover .t{color:var(--accent)}

/* ---- back link + footer ---- */
.back{display:inline-block;font-size:var(--t-micro);letter-spacing:.18em;text-transform:uppercase;color:var(--ink-4);text-decoration:none;margin-top:var(--s2)}
.back:hover{color:var(--accent)}
footer{padding:var(--s6) 0;text-align:center;border-top:1px solid var(--line);margin-top:var(--s6)}
.colophon{font-family:var(--serif);font-style:italic;font-size:var(--t-read);color:var(--ink-3);line-height:1.55;max-width:30ch;margin:0 auto}

/* ---- publications (papers.html) ---- */
.scholar-stats{display:flex;flex-wrap:wrap;align-items:baseline;gap:var(--s4);margin-top:var(--s4);
  padding:var(--s3) 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);
  text-decoration:none;color:inherit}
.scholar-stats .stat{font-family:var(--serif);font-size:var(--t-ui);color:var(--ink-3)}
.scholar-stats .stat b{font-family:var(--serif);font-size:var(--t-2);font-weight:500;color:var(--ink);margin-right:.3em;font-feature-settings:"lnum"}
.scholar-stats .stat-src{margin-left:auto;font-family:var(--sans);font-size:var(--t-micro);
  letter-spacing:.16em;text-transform:uppercase;color:var(--ink-4)}
.scholar-stats:hover .stat-src{color:var(--accent)}

.pubgroup{margin-top:var(--s5)}
.pubgroup h2{font-family:var(--sans);font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;
  color:var(--ink-4);font-weight:500;margin-bottom:var(--s1)}
.pub{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:var(--s4);align-items:center;
  padding:var(--s3) 0;border-top:1px solid var(--line)}
.pub-title{font-family:var(--serif);font-size:var(--t-read);line-height:1.3;font-weight:500;color:var(--ink)}
.pub-note{font-family:var(--sans);font-size:var(--t-micro);letter-spacing:.12em;text-transform:uppercase;
  color:var(--ink-4);margin-left:.7em;vertical-align:.12em}
.pub-cite{font-size:var(--t-ui);line-height:1.45;color:var(--ink-3);margin-top:3px}
.pub-badges{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s2);margin-top:var(--s1)}
.pub-badge{font-size:var(--t-micro);letter-spacing:.04em;line-height:1.6;padding:1px 8px;border-radius:2px}
.pub-badge.cited{color:var(--ink-4);border:1px solid var(--line)}
.pub-badge.award{color:var(--accent);border:1px solid var(--accent);font-weight:500}  /* rare: only awarded papers */
.pub-fav{color:var(--accent);font-size:var(--t-ui);line-height:1}                       /* a personal favorite */

.pub-actions{display:flex;gap:var(--s1);flex-shrink:0}
.act{display:inline-flex;align-items:center;gap:.45em;font-family:var(--sans);font-size:var(--t-micro);
  letter-spacing:.1em;text-transform:uppercase;color:var(--ink-4);background:none;cursor:pointer;
  text-decoration:none;border:1px solid var(--line);border-radius:3px;padding:6px 11px;transition:.18s}
.act svg{width:1em;height:1em;display:block}
.act:hover{color:var(--accent);border-color:var(--accent)}
.copy-cite.copied{color:var(--accent);border-color:var(--accent)}

@media(max-width:760px){
  .wrap,.nav{padding-left:var(--s3);padding-right:var(--s3)}
  .nav{flex-direction:column;gap:var(--s2)}
  .hero{padding-top:var(--s4)}
  .thesis{font-size:2.75rem;max-width:none}
  .hero-row{grid-template-columns:minmax(0,1fr);gap:var(--s3)}
  .portrait{width:100%}
  .breath{padding:var(--s5) 0;margin-top:var(--s5)}.breath p{font-size:var(--t-read)}
  .grid{grid-template-columns:minmax(0,1fr);gap:0}
  .sec{border-top:1px solid var(--line);padding-top:var(--s3);margin-bottom:0}
  .sec:first-child{border-top:none}
  .item{grid-template-columns:minmax(0,1fr);gap:var(--s1)}
  .item .v{padding-top:0}
  .prose .portrait{float:none;width:100%;margin:0 0 var(--s3)}
  .scholar-stats{gap:var(--s3)}.scholar-stats .stat-src{margin-left:0;flex-basis:100%}
  .pub{grid-template-columns:minmax(0,1fr);gap:var(--s2)}
  .pub-actions{justify-content:flex-start}
}

/* ---- press (press.html) ---- */
.presslist{margin-top:var(--s4)}
.pressrow{display:grid;grid-template-columns:11rem minmax(0,1fr);gap:var(--s4);align-items:center;
  padding:var(--s3) 0;border-top:1px solid var(--line)}
.presslist .pressrow:last-child{border-bottom:1px solid var(--line)}
.press-outlet,.press-logo{display:flex;align-items:center;min-height:30px}
.press-logo img{max-width:140px;max-height:28px;object-fit:contain;filter:brightness(0) opacity(.58)}
.press-outlet .on-name{font-family:var(--serif);font-style:italic;font-size:var(--t-read);
  color:var(--ink-3);line-height:1.2}
.pressrow .t{font-family:var(--serif);font-size:var(--t-read);line-height:1.3;color:var(--ink)}
.pressrow .t-note{font-style:italic;color:var(--ink-4)}
.pressrow .m{font-size:var(--t-micro);letter-spacing:.06em;text-transform:uppercase;color:var(--ink-4);margin-top:4px}
.press-also{font-family:var(--serif);font-size:var(--t-ui);color:var(--ink-3);line-height:1.65;
  margin-top:var(--s3);max-width:var(--measure)}
.press-also em{font-style:italic}

.honors{margin-top:var(--s6)}
.honors h2{font-family:var(--serif);font-size:var(--t-2);color:var(--ink);
  margin-bottom:var(--s3);padding-top:var(--s4);border-top:1px solid var(--line)}
.honor-group{margin-bottom:var(--s4)}
.honor-label{font-size:var(--t-micro);letter-spacing:.2em;text-transform:uppercase;color:var(--ink-4);font-weight:500;margin-bottom:var(--s2)}
.honor-row{display:grid;grid-template-columns:5rem minmax(0,1fr);gap:var(--s3);padding:var(--s1) 0}
.hy{font-family:var(--serif);font-size:var(--t-read);color:var(--ink-4)}
.ht{font-family:var(--serif);font-size:var(--t-read);color:var(--ink-2);line-height:1.4}
.ht em{font-style:italic}

@media(max-width:760px){
  .pressrow{grid-template-columns:minmax(0,1fr);gap:var(--s1)}
  .press-outlet,.press-logo{min-height:0}
  .honor-row{grid-template-columns:4rem minmax(0,1fr);gap:var(--s2)}
}
