/* Refinement layer for the Equality / Social Lifestyle cluster (v2.1 handoff).
   Behavior and additions only — the approved homepage/category center and the
   header visual design are deliberately NOT restyled here. This layer carries
   the sticky rubric menu with its compact glyph logo, the vertical Cover Story
   sidebar unit, the Coming-soon states, the article chrome (crumb, ink rule,
   share row), and the branded utility/author/404 pages.
   Bump ?v= in EVERY attach point when editing: layouts/equality-longread/*.ejs,
   sector-shared/_utility.ejs, sector-shared/author.ejs, sector-shared/404.ejs,
   and the sector test. */

/* Pages without the site theme head still need the sector palette; mirror the
   base definitions at the layout level so author/404 keep the accent. */
.layout-equality-longread {
  --sector-accent: var(--vuga-color-accent, #a63a2e);
  --equality-line: #ddd8d1;
}

/* 🔒 Sticky menu (mandatory v2.1): the approved category menu stays pinned to
   the top of the screen while scrolling; a compact glyph logo appears beside
   it once the masthead has scrolled away. Colors, fonts, and composition of
   the approved header are untouched. */
.layout-equality-longread .sector-nav[data-equality-nav] { position: sticky; top: 0; z-index: 40; background: var(--sector-paper, #fffefc); }
.layout-equality-longread .equality-nav-logo { display: none; align-items: center; padding-right: 1rem; margin-right: .4rem; border-right: 1px solid var(--sector-line, #e0dcd6); }
.layout-equality-longread .equality-nav-glyph { display: block; color: var(--sector-accent); font: 600 1.5rem/1 'Crimson Pro', Georgia, serif; }
.eq-scrolled .layout-equality-longread .equality-nav-logo { display: inline-flex; }

/* 🔒 Cover Story sidebar unit (the only homepage addition): vertical magazine
   block in the right rail — portrait 3:4 cover, up to two text rows, closing
   link; Coming soon while the desk is empty. */
.layout-equality-longread .equality-home { display: grid; grid-template-columns: minmax(0, 1fr) 300px; column-gap: 3rem; align-items: start; }
.layout-equality-longread .equality-home > section { grid-column: 1; min-width: 0; }
.layout-equality-longread .equality-side { grid-column: 2; grid-row: 1 / span 3; position: sticky; top: 4.6rem; }
.layout-equality-longread .equality-cover-story { border-top: 2px solid var(--sector-ink, #1a1816); padding-top: 1.1rem; }
.layout-equality-longread .equality-cover-story h2 { margin: 0 0 .9rem; font: 700 .72rem/1.5 'Space Mono', monospace; letter-spacing: .18em; text-transform: uppercase; color: var(--sector-accent); }
.layout-equality-longread .equality-cs-feature { display: block; }
.layout-equality-longread .equality-cs-feature .sector-media { aspect-ratio: 3 / 4; }
.layout-equality-longread .equality-cs-feature h3 { font: 600 small-caps 1.35rem/1.15 'Crimson Pro', serif; letter-spacing: .02em; margin: .8rem 0 .4rem; }
.layout-equality-longread .equality-cs-feature .equality-meta { display: block; }
.layout-equality-longread .equality-cs-more { display: block; padding: .85rem 0; border-top: 1px solid var(--equality-line, #ddd8d1); }
.layout-equality-longread .equality-cs-more h4 { font: 600 small-caps 1.1rem/1.2 'Crimson Pro', serif; margin: .3rem 0 0; }
.layout-equality-longread .equality-cs-all { display: block; margin-top: .9rem; padding-top: .9rem; border-top: 1px solid var(--equality-line, #ddd8d1); color: var(--sector-accent); }
.layout-equality-longread .equality-cover-story > p { margin: .4rem 0; color: var(--sector-muted, #7d7770); font-size: .98rem; line-height: 1.55; }

/* 🔒 Empty approved rubrics publish a Coming soon card instead of a bare
   grid; the header block of the category page is untouched. */
.layout-equality-longread .equality-coming-soon { margin-top: 3rem; padding: 2.2rem 2rem; border: 1px dashed var(--equality-line, #ddd8d1); background: #faf8f4; }
.layout-equality-longread .equality-coming-soon .equality-label { color: var(--sector-accent); }
.layout-equality-longread .equality-coming-soon h2 { font: 600 small-caps 2.2rem/1 'Crimson Pro', serif; margin: .6rem 0; }
.layout-equality-longread .equality-coming-soon p { max-width: 44rem; color: var(--sector-muted, #7d7770); line-height: 1.6; }

/* 🔒 Article chrome: mono-caps breadcrumb above the split hero (HOME carries
   the accent), ink rule under the byline, share chips with canonical URLs.
   The approved split hero and reading grid are untouched. */
.layout-equality-longread .equality-crumb { margin-bottom: 1.4rem; font: 400 10px/1.6 'Space Mono', monospace; letter-spacing: .18em; text-transform: uppercase; color: var(--sector-muted, #7d7770); }
.layout-equality-longread .equality-crumb a { color: var(--sector-accent); }
.layout-equality-longread .equality-article-split header .equality-meta { border-bottom: 2px solid var(--sector-ink, #1a1816); padding-bottom: 1.1rem; }
.layout-equality-longread .equality-share { display: flex; align-items: center; flex-wrap: wrap; gap: .55rem; margin-top: 1.2rem; }
.layout-equality-longread .equality-share > span { font: 400 10px/1 'Space Mono', monospace; letter-spacing: .18em; text-transform: uppercase; color: var(--sector-muted, #7d7770); margin-right: .3rem; }
.layout-equality-longread .equality-share a { border: 1px solid var(--equality-line, #ddd8d1); padding: .5rem .75rem; font: 400 10px/1 'Space Mono', monospace; letter-spacing: .12em; text-transform: uppercase; color: var(--sector-ink, #1a1816); background: var(--sector-paper, #fffefc); }
.layout-equality-longread .equality-share a:hover { border-color: var(--sector-accent); color: var(--sector-accent); }

/* 🔒 Author card under the essay speaks in the same two voices: mono label,
   serif name, ink rule above the More-about link. */
.layout-equality-longread .sector-author { border-top: 2px solid var(--sector-ink, #1a1816); background: transparent; padding: 1.6rem 0; }
.layout-equality-longread .sector-author h2 { font: 600 small-caps 1.6rem/1.1 'Crimson Pro', serif; }
.layout-equality-longread .sector-author a { font: 400 10px/1.6 'Space Mono', monospace; letter-spacing: .14em; text-transform: uppercase; color: var(--sector-accent); text-decoration: none; }

/* 🔒 Utility pages wear the sector's editorial header: mono crumb, large
   small-caps Crimson heading, ink rule; about body reads as magazine text. */
.layout-equality-longread .sector-utility-wrap { max-width: 820px; }
.layout-equality-longread .sector-utility .sector-crumb { font: 400 10px/1.6 'Space Mono', monospace; letter-spacing: .18em; text-transform: uppercase; color: var(--sector-muted, #7d7770); }
.layout-equality-longread .sector-utility .sector-crumb a { color: var(--sector-accent); }
.layout-equality-longread .sector-utility > h1 { font: 600 small-caps clamp(2.4rem, 5vw, 3.6rem)/1 'Crimson Pro', serif; letter-spacing: .02em; margin: .7rem 0 0; padding-bottom: 1.2rem; border-bottom: 2px solid var(--sector-ink, #1a1816); }
.layout-equality-longread .sector-utility .sector-utility-intro { color: var(--sector-muted, #7d7770); }
.layout-equality-longread .sector-utility--about .sector-about-body { font-size: 1.13rem; line-height: 1.75; }
.layout-equality-longread .sector-utility--about .sector-about-body p { margin: 0 0 1.5rem; }
.layout-equality-longread .sector-utility--about .about-team,
.layout-equality-longread .sector-utility--about .about-network { margin-top: 3rem; padding-top: 1.6rem; border-top: 1px solid var(--equality-line, #ddd8d1); }
.layout-equality-longread .sector-utility--about .team-member img { border-radius: 50%; }
.layout-equality-longread .sector-utility--about .team-member .name { font: 600 small-caps 1.2rem 'Crimson Pro', serif; margin-top: .55rem; }

/* Contact page keeps exactly one h1 and the same header; its form speaks the
   sector language: mono labels, hairline fields, ink button. */
.layout-equality-longread .sector-utility #contact-page-title { font: 600 small-caps clamp(2.4rem, 5vw, 3.6rem)/1 'Crimson Pro', serif; margin: .7rem 0 0; padding-bottom: 1.2rem; border-bottom: 2px solid var(--sector-ink, #1a1816); }
.layout-equality-longread .vuga-contact-form label { font: 400 10px/1.6 'Space Mono', monospace; letter-spacing: .14em; text-transform: uppercase; color: var(--sector-muted, #7d7770); }
.layout-equality-longread .vuga-contact-form input,
.layout-equality-longread .vuga-contact-form textarea { width: 100%; border: 1px solid var(--equality-line, #ddd8d1); padding: .75rem .9rem; font: 400 1.05rem/1.5 'Crimson Pro', serif; background: var(--sector-paper, #fffefc); }
.layout-equality-longread .vuga-contact-form input:focus,
.layout-equality-longread .vuga-contact-form textarea:focus { outline: none; border-color: var(--sector-accent); }
.layout-equality-longread .vuga-contact-form button[type="submit"] { border: 0; padding: .85rem 1.5rem; background: var(--sector-ink, #1a1816); color: #fff; font: 400 10px/1 'Space Mono', monospace; letter-spacing: .16em; text-transform: uppercase; cursor: pointer; }
.layout-equality-longread .vuga-contact-form button[type="submit"]:hover { background: var(--sector-accent); }

/* 🔒 Author page in the sector voice: mono Author label, portrait tile, serif
   name over an ink rule, card grid below. */
.layout-equality-longread .sector-wrap { max-width: 820px; }
.layout-equality-longread .sector-author-page { grid-template-columns: 7.5rem minmax(0, 1fr); gap: 1.8rem; padding-bottom: 1.6rem; border-bottom: 2px solid var(--sector-ink, #1a1816); }
.layout-equality-longread .sector-author-page-photo { width: 7.5rem; height: 7.5rem; object-fit: cover; background: #faf8f4; }
.layout-equality-longread .sector-author-page .sector-kicker { font: 400 10px/1.6 'Space Mono', monospace; letter-spacing: .2em; text-transform: uppercase; color: var(--sector-accent); }
.layout-equality-longread .sector-author-page h1 { font: 600 small-caps clamp(2.4rem, 5vw, 3.4rem)/1 'Crimson Pro', serif; margin: .5rem 0 .8rem; }
.layout-equality-longread .sector-author-bio { color: var(--sector-muted, #7d7770); line-height: 1.7; }
.layout-equality-longread .sector-author-title,
.layout-equality-longread .sector-author-credentials { font: 400 10px/1.7 'Space Mono', monospace; letter-spacing: .1em; text-transform: uppercase; }
.layout-equality-longread .sector-author-articles .sector-section-head { border-bottom: 2px solid var(--sector-ink, #1a1816); }
.layout-equality-longread .sector-author-articles .sector-section-head h2 { font: 600 small-caps 2rem 'Crimson Pro', serif; }
.layout-equality-longread .sector-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2.2rem 2.5rem; }
.layout-equality-longread .sector-card .sector-media { aspect-ratio: 4 / 3; }
.layout-equality-longread .sector-card h3 { font: 600 small-caps 1.5rem/1.15 'Crimson Pro', serif; }

/* 🔒 404 shares the sector voice (not-found.css provides the scaffold). */
.layout-equality-longread .not-found-main h1 { font: 600 small-caps clamp(2.6rem, 6vw, 4rem)/1 'Crimson Pro', serif; }

@media (max-width: 1080px) {
  .layout-equality-longread .equality-home { grid-template-columns: 1fr; }
  .layout-equality-longread .equality-home > section { grid-column: 1; }
  .layout-equality-longread .equality-side { grid-column: 1; grid-row: auto; position: static; max-width: 420px; }
}

@media (max-width: 760px) {
  .layout-equality-longread .sector-author-page { grid-template-columns: 1fr; }
  .layout-equality-longread .sector-author-page-photo { width: 5.5rem; height: 5.5rem; }
  .layout-equality-longread .sector-grid { grid-template-columns: 1fr; }
}