/* ------------------------------------------------------------------
   Article typography and the paged index listing.

   Loaded from default.hbs AFTER {{ghost_head}}, so these rules sit later
   in the cascade than Code Injection and win at equal specificity.
   Selectors below deliberately MATCH the injection selectors they answer
   rather than escalating specificity, so the pairing stays legible when
   someone greps for the original rule.

   px is used where the value must not move with the 10px root; em/rem
   only where the injection rule it replaces already used them.

   WHAT IS DELIBERATELY NOT TOUCHED: Poetry, Fiction, Poetry-Essays,
   Spotlight (tag-featured) and Issues article templates all set their own
   title, h2 and dek treatments on purpose. Those are section voices, not
   drift. Only Essays and Interviews — the two that were running the
   generic Work Sans 300 / -2px setting — are retuned here.
   ------------------------------------------------------------------ */


/* ==================================================================
   ARTICLE TITLES

   The Essays front sets a headline in EB Garamond 600 at -0.017em; the
   article it links to set the same headline in Work Sans 300 at -2px.
   The voice broke at the moment of arrival. These match the index.

   -2px was also an absolute value, so it did not scale: at mobile
   headline sizes it pinched letterforms that were never drawn to sit
   that close. em tracking scales with the type.

   Answers: 70-sections.css `article.tag-essays h1.gh-article-title`
            70-sections.css `article.tag-interviews h1.gh-article-title`
   ================================================================== */

article.tag-essays h1.gh-article-title,
article.tag-interviews h1.gh-article-title,
article.tag-Interviews h1.gh-article-title {
  color: #11100e;
  font-family: "EB Garamond", Georgia, serif;
  font-size: 320%;              /* was 290%; EB Garamond's smaller x-height
                                   needs the step to hold the same weight
                                   on the page as the index headline */
  font-weight: 600;
  letter-spacing: -.018em;      /* was -.2rem, i.e. a fixed -2px */
  line-height: 1.04;
}

/* Posts with no section treatment of their own were falling through to
   the same generic setting. The exclusions are the templates that style
   their own titles. */
body.post-template article.gh-article:not(.tag-arts):not(.tag-poetry):not(.tag-poetry-essays):not(.tag-arts-fiction):not(.tag-featured):not(.tag-issues):not(.tag-issue) h1.gh-article-title {
  font-family: "EB Garamond", Georgia, serif;
  font-weight: 600;
  letter-spacing: -.018em;
}


/* ==================================================================
   SUB-HEADINGS INSIDE ARTICLES

   These h2s are a deliberate device — a white plate between red-diamond
   rules on Essays, a plate at 90% width on Interviews — and the layout
   is left exactly as it is. The defect was only that no rule ever gave
   them a font-family, so they fell through to Mulish, the stock Ghost
   Source face, which belongs to no part of the palette.

   EB Garamond is already the house pull-quote face: the imported-WordPress
   pull quotes (article.tag-hash-wp .gh-content > h6) are set in it.

   Answers: 70-sections.css `article.tag-essays h2`
            70-sections.css `article.tag-Interviews h2`
   ================================================================== */

article.tag-essays h2,
article.tag-interviews h2,
article.tag-Interviews h2 {
  color: #1d1917;
  font-family: "EB Garamond", Georgia, serif;
  font-weight: 600;
  letter-spacing: -.02em;
  line-height: 1.12;
}

/* Same leak, anywhere else a post body carries an h2. */
body.post-template article.gh-article:not(.tag-arts):not(.tag-poetry):not(.tag-poetry-essays):not(.tag-arts-fiction):not(.tag-featured):not(.tag-issues) .gh-content h2 {
  font-family: "EB Garamond", Georgia, serif;
}


/* ==================================================================
   THE DEK ON MOBILE

   Desktop keeps the bordered plate. On a 375px screen that plate ran to
   roughly thirteen lines of Work Sans 22.4px with -1px tracking — a wall
   of grey between the headline and the first sentence, which pushed the
   article itself entirely below the fold.

   Italic EB Garamond is how the Interviews front already sets a dek, and
   it is how a magazine sets a standfirst.

   Answers: 70-sections.css `article.tag-essays .gh-article-excerpt`
            70-sections.css `article.tag-interviews .gh-article-excerpt`
   ================================================================== */

@media (max-width: 767px) {
  article.tag-essays .gh-article-excerpt,
  article.tag-interviews .gh-article-excerpt,
  article.tag-Interviews .gh-article-excerpt {
    padding: 0 0 0 14px !important;
    color: #37322f !important;
    /* !important answers `font-family:'Work Sans' !important` on the
       injection rule this replaces. */
    font-family: "EB Garamond", Georgia, serif !important;
    font-size: 18px !important;
    font-style: italic;
    font-weight: 500 !important;
    letter-spacing: 0 !important;
    line-height: 1.34 !important;
    background: transparent !important;
    border: 0 !important;
    border-left: 2px solid #9c3e2f !important;
  }
}


/* ==================================================================
   THE PAGED INDEX LISTING  (/page/2 — body.paged)

   The one page still wearing stock Ghost Source: "Archive" in Mulish
   800/36px, every headline in Mulish 800/24px, default reading-time
   chips. It is linked from the foot of every article.

   NOTE FOR WHOEVER PICKS THIS UP: this is NOT /archive/. The real
   archive is page-archive.hbs and is already well built. This page is
   index.hbs, it is capped at 100 posts by Ghost 6 (see AGENTS.md 6.4),
   and it also calls itself "Archive" — two different pages under one
   name. Styling it does not fix that; see the handoff note.
   ================================================================== */

body.paged header.gh-pagehead-content {
  padding: 0 0 1.4rem !important;
  border: 0 !important;
  border-bottom: 2px solid #11100e !important;
}

body.paged .gh-pagehead-title {
  color: #11100e;
  font-family: "EB Garamond", Georgia, serif;
  font-size: clamp(4.2rem, 6vw, 6.4rem);
  font-weight: 600;
  letter-spacing: -.022em;
  line-height: 1;
}

body.paged .gh-pagehead-description {
  margin-top: 1.1rem;
  color: #7f130d;
  font-family: "Work Sans", Arial, sans-serif;
  font-size: 1.2rem;
  font-weight: 700;
  letter-spacing: .18em;
  line-height: 1.4;
  text-transform: uppercase;
}

/* Rows read as a ledger, the way the real archive's rows do. */
body.paged .gh-feed .gh-card-link {
  padding: 2.6rem 0;
}

body.paged .gh-feed .gh-card-title {
  margin-top: .6rem;
  color: #11100e;
  font-family: "EB Garamond", Georgia, serif;
  font-size: 2.7rem;
  font-weight: 600;
  letter-spacing: -.016em;
  line-height: 1.16;
}

body.paged .gh-feed .gh-card-link:hover .gh-card-title {
  color: #7f130d;
  opacity: 1;
}

body.paged .gh-feed .gh-card-excerpt {
  margin-top: .8rem;
  color: #3a3535;
  font-size: 1.9rem;
  font-weight: 400;
  line-height: 1.36;
}

body.paged .gh-feed .gh-card-date,
body.paged .gh-feed .gh-card-month {
  color: #8a827a;
  font-family: "Work Sans", Arial, sans-serif;
  font-size: 1.15rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
}

/* The reading-time chip is a stock UI box — a hard rectangle with a
   hairline border. The Interviews front already solved this: one
   letterspaced line, no box. */
body.paged .gh-feed span.reading_time {
  padding: 0 !important;
  color: #8a827a;
  font-family: "Work Sans", Arial, sans-serif;
  font-size: 1.15rem;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  border: 0 !important;
}

/* loop.hbs passes minute="" so anything under a minute renders an empty
   span — poems, mostly. Without the :not(:empty) guard those rows show a
   bare middot floating at the right margin. */
body.paged .gh-feed span.reading_time:not(:empty)::before {
  margin: 0 .55em;
  color: #c9c2ba;
  content: "\00B7";
}