/* Shared archive hero, followed by a written introduction and the selection. */
.essential-collection .collection-hero h1 { font-size:var(--s13-section-title-size); line-height:1; }
.essential-section-heading { display:flex; justify-content:space-between; align-items:baseline; gap:16px; margin-top:clamp(2rem,4vw,3.5rem); padding:clamp(2rem,4vw,3.5rem) 0 24px; border-top:1px solid var(--s13-line); }
.essential-section-heading h2 { margin:0; font-size:13px; font-weight:500; letter-spacing:.09em; text-transform:uppercase; }
.essential-section-heading>span { font-size:12px; color:var(--s13-muted); }
.essential-continue { margin-top:64px; padding:32px 0; border-top:1px solid var(--s13-line); display:flex; justify-content:space-between; align-items:center; gap:24px; }
.essential-continue p { color:var(--s13-secondary); margin:0; max-width:62ch; line-height:1.6; }
.essential-continue > a { flex-shrink:0; }
.s13-selection-introduction { max-width:76ch; padding:clamp(32px,4vw,56px) 0 12px; color:var(--s13-reading); font-size:clamp(17px,1.4vw,21px); line-height:1.65; }
.s13-selection-introduction p { margin:0 0 1.15em; }
.s13-selection-introduction p:last-child { margin-bottom:0; }
.s13-mix-collection-nav { padding:28px 0 36px; }
/* A filtered single page needs the separator normally supplied by pagination.
 * The adjacent archive is replaced by AJAX, so the presence check stays current. */
.collection--mixes > .archive-browser--paged:not(:has(> .archive-pagination)) + .s13-mix-collection-nav {
 margin-top:clamp(2rem,4vw,4rem);
 padding-top:clamp(1.75rem,3vw,3rem);
 border-top:1px solid var(--s13-line);
}
/* Index rows and the empty state already finish with the same shared rule. */
.collection--mixes > .archive-browser--paged:not(:has(> .archive-pagination)):has(> .archive-results--list > .collection-row, > .archive-no-results) + .s13-mix-collection-nav {
 margin-top:0;
 padding-top:clamp(2rem,4vw,4rem);
 border-top:0;
}
.s13-mix-collection-nav > .eyebrow { display:block; margin:0 0 14px; }
.s13-mix-collection-nav ul { display:flex; flex-wrap:wrap; gap:12px clamp(24px,3vw,48px); padding:0; margin:0; list-style:none; }
.s13-mix-collection-nav li { min-width:0; }
.s13-mix-collection-nav a[aria-current="page"] { color:var(--s13-muted); }
@media(max-width:760px) {
 .essential-section-heading { align-items:flex-start; flex-direction:column; gap:8px; }
 .essential-continue { margin-top:40px; flex-direction:column; align-items:flex-start; gap:8px; }
 /* One shared row rhythm, including single-line labels beside wrapped ones. */
 .s13-mix-collection-nav ul { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); grid-auto-rows:1fr; gap:12px 20px; }
 .s13-mix-collection-nav li { display:flex; }
 .s13-mix-collection-nav .s13-text-action { display:grid; grid-template-columns:minmax(0,1fr) auto; align-items:center; flex:1; min-width:0; width:100%; font-size:11px; gap:12px; overflow-wrap:anywhere; }
}