Styling one page of a listing

CSS cannot read an address, so for a stylesheet the front page and /page/2/ used to be the same document -- which is why the two skins here both wanted a lead card or a profile block on the first page and neither could have one.

Since 1.3.2 a listing's <body> says which it is:

.page-first .post-list-item:first-child { /* the lead card */ }
.page-cont  .archive-note { /* only on the continuations */ }

page-first is the page that lives at the listing's own address, page-cont is everything under /page/N/, and both are emitted for every listing -- the front page, a tag, a series, a content type. A post page carries a bare <body>, so a rule scoped to either class cannot leak onto one.

Two of them exist rather than one on purpose: a single mark on the continuations would force you to write the first page's look unconditionally and then take it back property by property, and a rule that undoes another is the kind a later change quietly stops undoing. Scope positively instead.

One card can be more than first by position. With layout.lead_card on in config/site.yml, the card that opens the front page is handed its post's first picture -- placed before its words, whatever the height budget would have cut -- and marked for you:

.post-list-item--lead .content figure img { width: 100%; }

Without the setting no card carries the class, and a rule scoped to it does nothing; .page-first .post-list-item:first-child alone cannot do this, because the picture is usually not in the card to be styled.

A card of a picture post or a video post opens with its medium on every listing, setting or no setting, and says so: .post-list-item--media. One whose medium is taller than wide, or square, is also .post-list-item--media-tall, and site.css holds that medium to max-height: 22rem so it does not take a screen to itself:

.post-list-item--media .content > figure:first-child img { border-radius: 8px; }
.post-list-item--media-tall .content > figure:first-child img { max-height: 28rem; }

The build charges the card's height budget those same 22rem, so a much smaller cap leaves room the card does not use and a much larger one lets the card run long; neither breaks anything. The lead card above stays --lead alone.

The pair says nothing about which listing you are on. That is already in the markup: the front page's heading carries its own modifier, and a tag listing names itself.