/*
 * Finance Editorial refinement layer (2026-08-23).
 *
 * Approved network rules carried over from the Technology reference cycle,
 * expressed in the finance design language (Newsreader/Inter/Roboto Mono,
 * ink + gold palette). Loaded AFTER finance-editorial.2.0.8.min.css in every
 * finance template; bump the ?v= marker in all eight link points on change:
 * index/category/article/author/contact/404/data-page templates plus
 * partials/_finance_utility.ejs. Sector variables live on :root in the base
 * stylesheet, so author/404 pages keep the palette without extra scoping.
 */

/* Approved rule: the section menu is sticky under the ticker/masthead. */
.layout-finance-editorial .fin-nav { position: sticky; top: 0; z-index: 40; background: var(--fin-paper); }

/* ---- Homepage: lead column gains the follow card under the lead ---- */
.layout-finance-editorial .fin-lead-main { display: flex; flex-direction: column; gap: 1.4rem; min-width: 0; }
.layout-finance-editorial .fin-lead-follow { display: grid; grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); gap: 1.3rem; padding-top: 1.3rem; border-top: 1px solid var(--fin-line); }
.layout-finance-editorial .fin-lead-follow-media { display: block; min-width: 0; }
.layout-finance-editorial .fin-lead-follow-media .fin-media { aspect-ratio: 16 / 10; }
.layout-finance-editorial .fin-lead-follow-body { min-width: 0; }
.layout-finance-editorial .fin-lead-follow-body .fin-title { font-size: 1.45rem; margin: .4rem 0 .5rem; }
.layout-finance-editorial .fin-lead-follow-body .fin-dek { display: block; }

/* The rail closes with one text-only story (no image), matching the approved slot map. */
.layout-finance-editorial .fin-rail-text { display: block; padding-bottom: 0; border-bottom: none; }
.layout-finance-editorial .fin-rail .fin-rail-text { padding-top: 1.1rem; border-top: 1px solid var(--fin-line); }
.layout-finance-editorial .fin-rail-text .fin-title { font-size: 1.25rem; margin: .35rem 0 .5rem; }

/* ---- Homepage: rubric strips run two per row; an odd last band spans full
   width and its two cards sit side by side (Technology rule 4/7). ---- */
.layout-finance-editorial .fin-strips { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 2rem 2.5rem; min-width: 0; }
.layout-finance-editorial .fin-strip { min-width: 0; }
.layout-finance-editorial .fin-strip .fin-card-grid { grid-template-columns: 1fr; gap: 1.2rem; }
.layout-finance-editorial .fin-strips .fin-strip:last-child:nth-child(odd) { grid-column: 1 / -1; }
.layout-finance-editorial .fin-strips .fin-strip:last-child:nth-child(odd) .fin-card-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }

/* ---- Homepage sidebar: In focus list with numbered rows ---- */
.layout-finance-editorial .fin-focus li { display: grid; grid-template-columns: 2.1rem minmax(0, 1fr); gap: 0 .8rem; align-items: start; }
.layout-finance-editorial .fin-focus li:before { grid-column: 1; grid-row: 1 / span 2; align-self: start; }
.layout-finance-editorial .fin-focus .fin-kicker { grid-column: 2; margin: 0; }
.layout-finance-editorial .fin-focus a { grid-column: 2; }
.layout-finance-editorial .fin-focus .fin-kicker + a { margin-top: .1rem; }

/* ---- Cover Story is always the vertical magazine unit in the sidebar ---- */
.layout-finance-editorial .fin-cover-story .fin-cs-feature { display: block; margin-top: .4rem; }
.layout-finance-editorial .fin-cover-story .fin-cs-feature .fin-media { aspect-ratio: 3 / 4; }
.layout-finance-editorial .fin-cover-story .fin-cs-feature .fin-title { font-size: 1.3rem; margin: .55rem 0 .4rem; }
.layout-finance-editorial .fin-cs-more { display: block; padding: .8rem 0; border-top: 1px solid var(--fin-line); text-decoration: none; }
.layout-finance-editorial .fin-cs-more .fin-kicker { margin: 0; }
.layout-finance-editorial .fin-cs-more h4 { font: 600 1.05rem/1.25 var(--vuga-font-heading); margin: .3rem 0 0; color: var(--fin-ink); }
.layout-finance-editorial .fin-cs-more:hover h4 { color: var(--fin-link); }
.layout-finance-editorial .fin-cs-all { display: inline-block; margin-top: .9rem; font: 700 .7rem/1 var(--vuga-font-mono); letter-spacing: .08em; text-transform: uppercase; color: var(--fin-link); text-decoration: none; }
.layout-finance-editorial .fin-cs-all:hover { text-decoration: underline; }
.layout-finance-editorial .fin-cover-story > p { margin: .4rem 0; }

/* ---- Latest News band closes the page under the two columns ---- */
.layout-finance-editorial .fin-latest { margin-top: 2.25rem; }
.layout-finance-editorial .fin-view-all { color: var(--fin-link); font: 700 .68rem/1 var(--vuga-font-mono); letter-spacing: .07em; text-transform: uppercase; text-decoration: none; }
.layout-finance-editorial .fin-view-all:hover { text-decoration: underline; }

/* ---- Category: Previous/Next pager replaces numbered links ---- */
.layout-finance-editorial .fin-pagination { display: flex; gap: .6rem; margin-top: 1.6rem; }
.layout-finance-editorial .fin-pagination .fin-page-link { display: inline-block; padding: .55rem .95rem; border: 1px solid var(--fin-line); border-radius: .35rem; font: 700 .7rem/1 var(--vuga-font-mono); letter-spacing: .07em; text-transform: uppercase; color: var(--fin-ink); background: var(--fin-paper); text-decoration: none; }
.layout-finance-editorial .fin-pagination .fin-page-link:hover { border-color: var(--fin-accent); color: var(--fin-link); }
.layout-finance-editorial .fin-pagination .fin-page-state { align-self: center; font: 600 .72rem/1 var(--vuga-font-mono); letter-spacing: .06em; color: var(--fin-muted); }

/* Approved-but-empty sections publish a Coming soon notice instead of a blank list. */
.layout-finance-editorial .fin-coming-soon { padding: 1.6rem 1.4rem; margin-top: 1.4rem; border: 1px solid var(--fin-line); background: var(--fin-warm); }
.layout-finance-editorial .fin-coming-soon .fin-kicker { margin: 0; color: var(--fin-link); }
.layout-finance-editorial .fin-coming-soon .fin-dek { margin: .5rem 0 0; }

/* ---- Cover Story category page: magazine spread (portrait hero + 3x2 grid) ---- */
.layout-finance-editorial .fin-cs-page { margin-top: .5rem; }
.layout-finance-editorial .fin-cs-hero { display: grid; grid-template-columns: minmax(0, 30rem) minmax(0, 1fr); gap: 1.8rem; padding: 1.2rem 0 1.8rem; border-bottom: 2px solid var(--fin-ink); margin-bottom: 1.7rem; }
.layout-finance-editorial .fin-cs-hero-media { display: block; min-width: 0; }
.layout-finance-editorial .fin-cs-hero-media .fin-media { aspect-ratio: 3 / 4; }
.layout-finance-editorial .fin-cs-hero .fin-title { font: 700 clamp(1.8rem, 3vw, 2.6rem)/1.08 var(--vuga-font-heading); margin: .5rem 0 .55rem; }
.layout-finance-editorial .fin-cs-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.8rem 1.6rem; }
.layout-finance-editorial .fin-cs-grid article .fin-media { aspect-ratio: 3 / 4; }
.layout-finance-editorial .fin-cs-grid .fin-title { font-size: 1.12rem; margin: .45rem 0 .3rem; }

/* ---- Article: mono crumb with accent Home, ink rule under the byline,
   share chips right below (Technology rule 6). ---- */
.layout-finance-editorial .fin-article .fin-article-crumb { font: 700 .7rem/1 var(--vuga-font-mono); letter-spacing: .09em; text-transform: uppercase; }
.layout-finance-editorial .fin-article .fin-article-crumb a { color: var(--fin-link); text-decoration: none; }
.layout-finance-editorial .fin-article .fin-article-crumb a:hover { text-decoration: underline; }
.layout-finance-editorial .fin-article .fin-article-meta { padding-bottom: 1.15rem; border-bottom: 2px solid var(--fin-ink); }
.layout-finance-editorial .fin-share { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; margin: 1.1rem 0 0; }
.layout-finance-editorial .fin-share > span { font: 700 .68rem/1 var(--vuga-font-mono); letter-spacing: .09em; text-transform: uppercase; color: var(--fin-muted); margin-right: .2rem; }
.layout-finance-editorial .fin-share a { border: 1px solid var(--fin-line); border-radius: .35rem; padding: .45rem .7rem; font: 700 .66rem/1 var(--vuga-font-mono); letter-spacing: .06em; text-transform: uppercase; color: var(--fin-ink); background: var(--fin-paper); text-decoration: none; }
.layout-finance-editorial .fin-share a:hover { border-color: var(--fin-accent); color: var(--fin-link); }

/* ---- Responsive ---- */
@media (max-width: 1020px) {
  .layout-finance-editorial .fin-strips { grid-template-columns: 1fr; }
  .layout-finance-editorial .fin-strips .fin-strip:last-child:nth-child(odd) .fin-card-grid { grid-template-columns: 1fr; }
  .layout-finance-editorial .fin-cs-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .layout-finance-editorial .fin-lead-follow { grid-template-columns: minmax(0, 11rem) minmax(0, 1fr); gap: 1rem; }
  .layout-finance-editorial .fin-lead-follow-body .fin-title { font-size: 1.2rem; }
  .layout-finance-editorial .fin-lead-follow-body .fin-dek { display: none; }
  .layout-finance-editorial .fin-cs-hero { grid-template-columns: 1fr; gap: 1.2rem; }
  .layout-finance-editorial .fin-cs-grid { grid-template-columns: 1fr; }
  .layout-finance-editorial .fin-latest { margin-top: 1.6rem; }
}


/* ---- Footer (user review 2026-08-23): the footer brand sits a step below
   the masthead title, and the whole footer column narrows toward the center
   so the legal links no longer hug the screen edges. ---- */
.layout-finance-editorial .fin-footer .fin-wordmark { font-size: clamp(1.3rem, 2.6vw, 1.75rem); }
.layout-finance-editorial .fin-footer-in { width: min(1000px, 100%); gap: 2.5rem; }
.layout-finance-editorial .fin-footer-bottom { width: min(1000px, 100%); margin: 0 auto; }
@media (max-width: 760px) {
  .layout-finance-editorial .fin-footer-in { padding-inline: 1rem; }
  .layout-finance-editorial .fin-footer-bottom { padding-inline: 1rem; }
}


/* ---- Shared geometry (user review 2026-08-23): the homepage column is the
   width benchmark; category pages center on it instead of the legacy
   4rem offset. ---- */
.layout-finance-editorial .fin-category-wrap { margin-left: auto; margin-right: auto; }


/* ---- Screen-reader utility (user review 2026-08-23): the homepage H1 must
   stay visually hidden even when the base stylesheet bundle is absent, or the
   wordmark line leaks above the date bar. ---- */
.layout-finance-editorial .sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap; border: 0; }


/* ---- Card and listing links (user review 2026-08-24): production hides the
   browser's default underline in the base stylesheet bundle; the preview runs
   without that bundle, so this layer owns the reset for the whole layout.
   Headlines stay clean everywhere; in-text links keep their underline. ---- */
.layout-finance-editorial a { text-decoration: none; }
.layout-finance-editorial .fin-article-body a,
.layout-finance-editorial .fin-disclosure a,
.layout-finance-editorial .fin-article-extras a,
.layout-finance-editorial .fin-utility a { text-decoration: underline; text-underline-offset: 3px; }
.layout-finance-editorial .fin-cs-feature > a:hover .fin-title,
.layout-finance-editorial a.fin-cs-more:hover h4 { color: var(--fin-link); }


/* ---- Data hub joins the site column (user review 2026-08-24): the dataset
   pages sit on the same 1200px column as the masthead and menu instead of a
   narrower inset frame. ---- */
.layout-finance-editorial .finance-data-main { width: min(1200px, 100%); padding: 1.75rem 1.5rem 2.5rem; }


/* ---- Section heads (user review 2026-08-24): the ink rule sits ABOVE the
   title — the name comes after the line, never touching it. ---- */
.layout-finance-editorial .fin-section-head { border-bottom: none; border-top: 2px solid var(--fin-ink); padding: 0.65rem 0 0; margin-bottom: 1.05rem; align-items: baseline; }


/* ---- Review 2026-08-24 (2): centered section/page heads; the Cover Story
   sidebar unit drops its heavy top rule and keeps the vertical magazine
   geometry. ---- */
.layout-finance-editorial .fin-section-head { justify-content: center; text-align: center; }
.layout-finance-editorial .fin-category-head { text-align: center; }
.layout-finance-editorial .fin-category-head .fin-chips { justify-content: center; }
.layout-finance-editorial .fin-author-page { text-align: center; }
.layout-finance-editorial .fin-cover-story { border-top: none; padding-top: 0; }

/* ---- 2026-09-05 canon width gate (network-wide fix): lift the base
   fin-utility 760px squeeze so utility pages fill the shared 1180px
   container. Same fix as arts/bp/edu/ent. */
.layout-finance-editorial .fin-utility { width: min(1180px, 100%); margin: 0 auto; }
.layout-finance-editorial .fin-utility--about > .fin-crumb,
.layout-finance-editorial .fin-utility--about > h1,
.layout-finance-editorial .fin-utility--about > .fin-about-body,
.layout-finance-editorial .fin-utility--about > .about-team,
.layout-finance-editorial .fin-utility--about > .about-network { width: 100%; margin-left: 0; margin-right: 0; }

/* ---- 2026-09-06 wave 3: no breadcrumb on author/about/data (removed in
   markup); author name, bio, about body and data title read smaller. */
.layout-finance-editorial .sector-author-page-content h1 { font-size: clamp(1.5rem, 3vw, 2rem) !important; }
.layout-finance-editorial .sector-author-bio { font-size: .92rem !important; }
.layout-finance-editorial .sector-about-body { font-size: .95rem !important; }
.layout-finance-editorial .sector-about-body h1, .layout-finance-editorial .sector-utility > h1 { font-size: clamp(1.6rem, 4vw, 2.2rem) !important; }
.layout-finance-editorial .data-main h1 { font-size: clamp(1.6rem, 4vw, 2.2rem) !important; }

.layout-finance-editorial .fin-author-page h1 { font-size: clamp(1.5rem, 3vw, 2rem) !important; }
.layout-finance-editorial .fin-about-body { font-size: .95rem !important; }
.layout-finance-editorial .fin-utility--about > h1 { font-size: clamp(1.6rem, 4vw, 2.2rem) !important; }
.layout-finance-editorial .fin-utility--about > .fin-about-body { font-size: .95rem !important; }

/* ---- 2026-09-07 header round 14: the header is ONLY the sticky menu bar.
   Site name sits on the left of the bar, category links flow after it,
   search toggle on the right. Big centered masthead and the date utility
   strip are gone; the market ticker stays below the bar (non-sticky). ---- */
.layout-finance-editorial .fin-topbar {
  position: sticky; top: 0; z-index: 60;
  display: flex; align-items: center; gap: 1.25rem;
  background: var(--fin-paper); border-bottom: 1px solid var(--fin-line);
  padding: 0 1.5rem; width: min(1180px, 100%); margin: 0 auto;
}
.layout-finance-editorial .fin-topbar .fin-brand {
  flex: 0 0 auto; text-align: left; text-decoration: none;
}
.layout-finance-editorial .fin-topbar .fin-wordmark {
  font-size: 1.05rem; letter-spacing: .08em; white-space: nowrap;
  color: var(--fin-ink);
}
.layout-finance-editorial .fin-topbar .fin-brand:hover .fin-wordmark { color: var(--fin-link); }
.layout-finance-editorial .fin-topbar .fin-nav {
  flex: 1 1 0; min-width: 0; border-bottom: none; overflow: hidden;
}
.layout-finance-editorial .fin-topbar .fin-nav-in { padding: .8rem 0; }
.layout-finance-editorial .fin-topbar .fin-mast-actions {
  flex: 0 0 auto; display: flex; align-items: center; gap: .65rem;
}
@media (max-width: 760px) {
  .layout-finance-editorial .fin-topbar { padding: 0 1rem; gap: .75rem; }
  .layout-finance-editorial .fin-topbar .fin-wordmark { font-size: .95rem; }
  .layout-finance-editorial .fin-topbar .fin-nav-in { padding: .65rem 0; }
  .layout-finance-editorial .fin-topbar .fin-mast-actions { display: flex; }
}

/* ---- 2026-09-08 homepage round 15: new body composition.
   Section 1 — Latest News left (lead + small + text-only) vs category 1
   right (two full cards + one text-only). Section 2 — categories 2-5 as a
   2x2 column block with Cover Story and In focus in the side rail. Section
   3 — full-width band of four two-week picks. Every homepage article reads
   category (brand color) / title / annotation / author / date. ---- */
.layout-finance-editorial .fin-section-head--left { justify-content: flex-start; text-align: left; }
.layout-finance-editorial .fin-lead-main { display: grid; gap: 1.4rem; align-content: start; }
.layout-finance-editorial .fin-lead-main .fin-lead .fin-title { font-size: clamp(1.6rem, 3vw, 2.3rem); }
.layout-finance-editorial .fin-lead-main .fin-lead-follow .fin-title,
.layout-finance-editorial .fin-lead-main .fin-lead-text .fin-title { font-size: 1.15rem; }
.layout-finance-editorial .fin-rail { gap: 1.5rem; }
.layout-finance-editorial .fin-rail article { padding-bottom: 0; border-bottom: none; }
.layout-finance-editorial .fin-rail .fin-title { font-size: 1.1rem; }
.layout-finance-editorial .fin-columns { align-items: start; }
.layout-finance-editorial .fin-cat-columns {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 2rem 2.25rem; align-items: start;
}
.layout-finance-editorial .fin-cat-col { display: grid; gap: 1.4rem; align-content: start; }
.layout-finance-editorial .fin-cat-col .fin-card { display: grid; gap: .1rem; }
.layout-finance-editorial .fin-cat-col .fin-title { font-size: 1.05rem; }
.layout-finance-editorial .fin-band { margin-top: 1.75rem; }
.layout-finance-editorial .fin-band-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.6rem; margin-top: 1.1rem; }
.layout-finance-editorial .fin-band-grid .fin-title { font-size: 1.05rem; }
.layout-finance-editorial .fin-pubdate { color: var(--fin-muted); font: 500 .72rem/1.5 var(--vuga-font-interface); }
.layout-finance-editorial .fin-byline { margin-top: .35rem; }
.layout-finance-editorial .fin-dek { margin-bottom: .3rem; }
@media (max-width: 1000px) {
  .layout-finance-editorial .fin-band-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
  .layout-finance-editorial .fin-cat-columns { grid-template-columns: 1fr; }
  .layout-finance-editorial .fin-band-grid { grid-template-columns: 1fr; }
}

/* ---- 2026-09-08 article round 18: full container width, compact author
   note (avatar links to the profile; name + short covers line only), FAQ
   and Sources sit at the end of the body above the author. ---- */
.layout-finance-editorial .fin-article { width: min(1180px, 100%); }
.layout-finance-editorial .fin-author-box {
  display: flex; align-items: center; gap: .75rem;
  background: none; border: none; padding: 0; margin-top: 1.75rem;
}
.layout-finance-editorial .fin-author-box h2 { margin: 0; font: 600 .95rem/1.3 var(--vuga-font-interface); }
.layout-finance-editorial .fin-author-box h2 a { color: var(--fin-ink); text-decoration: none; }
.layout-finance-editorial .fin-author-box h2 a:hover { color: var(--fin-link); }
.layout-finance-editorial .fin-author-beat { margin: .15rem 0 0; color: var(--fin-muted); font: 500 .74rem/1.4 var(--vuga-font-interface); }
.layout-finance-editorial .fin-author-box .fin-avatar { width: 40px; height: 40px; }
.layout-finance-editorial .fin-article-extras { margin-top: 1.75rem; }
.layout-finance-editorial .fin-related { width: min(1180px, 100%); }
.layout-finance-editorial .fin-related-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 1.6rem; margin-top: 1.1rem; }
.layout-finance-editorial .fin-related-grid .fin-title { font-size: 1.02rem; }
@media (max-width: 1000px) { .layout-finance-editorial .fin-related-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 760px) { .layout-finance-editorial .fin-related-grid { grid-template-columns: 1fr; } }

/* ---- 2026-09-11 fin mobile header canon: the wordmark centers in the bar,
   burger pins left, lens pins right; the inline category strip hides on
   phones (the drawer covers navigation). */
@media (max-width: 760px) {
  /* The sticky topbar becomes the single phone bar: burger left, centered
     wordmark, lens right; category links live in the drawer. */
  .fin-topbar { position: sticky; top: 0; z-index: 40; display: flex; align-items: center; min-height: 56px; background: var(--fin-paper); }
  .fin-topbar .fin-nav { display: none; }
  .fin-topbar .fin-brand { position: absolute; left: 50%; transform: translateX(-50%); margin: 0; white-space: nowrap; }
  .fin-topbar .fin-menu-toggle { position: absolute; left: .9rem; top: 50%; transform: translateY(-50%); margin: 0; }
  .fin-topbar .fin-search-toggle { position: absolute; right: .9rem; top: 50%; transform: translateY(-50%); margin: 0; }
  .fin-topbar .fin-mast-actions { display: contents; }
}
