/* Behavior and utility refinements for the Business / Economy / Politics /
   Law cluster. The homepage/category center and the header VISUAL DESIGN are
   approved by another designer and are deliberately NOT restyled here — this
   layer only carries the v2.1 mandate: sticky header with a compact logo,
   the Cover Story sidebar unit, article chrome (crumb, ink rule, share),
   Coming-soon states, and the branded utility/author/404/data pages.
   Bump ?v= in EVERY attach point when editing: layouts/business-paper/*.ejs,
   sector-shared/_utility.ejs, sector-shared/author.ejs, sector-shared/404.ejs,
   and the sector test. */

/* Pages without the .bp body class (author, 404) still need the sector
   palette custom properties; mirror the .bp definitions at the layout level. */
.layout-business-paper {
  --paper: #fff1e5;
  --card: #fffaf5;
  --ink: #33302e;
  --ink-soft: #4a4540;
  --rule: #cec6b9;
  --rule2: #e6ddd1;
  --muted: #66605c;
  --gold: #b08d3b;
  --accent: var(--vuga-color-accent, #0d7680);
}

/* 🔒 Sticky header behavior (v2.1): masthead + rubric menu stay pinned to the
   top while scrolling, and the wordmark shrinks into a compact mode. Colors,
   fonts, and composition of the approved header are untouched; the compaction
   is a scroll-driven animation that leaves the resting design pixel-identical
   and simply holds the full-size logo in browsers without scroll timelines. */
.layout-business-paper .sector-sticky-head { position: sticky; top: 0; z-index: 30; background: var(--paper); }
@supports (animation-timeline: scroll()) {
  .layout-business-paper .sector-sticky-head .sector-masthead { animation: bp-masthead-compact linear both; animation-timeline: scroll(root); animation-range: 0 9rem; }
  .layout-business-paper .sector-sticky-head .sector-brand strong { animation: bp-wordmark-compact linear both; animation-timeline: scroll(root); animation-range: 0 9rem; }
  .layout-business-paper .sector-sticky-head .sector-brand span { animation: bp-tagline-compact linear both; animation-timeline: scroll(root); animation-range: 0 9rem; }
}
@keyframes bp-masthead-compact { to { min-height: 3.4rem; padding-top: .35rem; padding-bottom: .3rem; } }
@keyframes bp-wordmark-compact { to { font-size: 1.45rem; } }
@keyframes bp-tagline-compact { to { font-size: 7px; letter-spacing: .18em; } }

/* 🔒 Cover Story sidebar unit (the only homepage addition): vertical 3:4
   cover, up to two text lines, closing link; Coming soon while empty. */
.layout-business-paper .bp-cs-side { margin-top: 1.3rem; padding-top: 1.1rem; border-top: 2px solid var(--ink); }
.layout-business-paper .bp-cs-side h2 { font: 700 1.15rem/1 var(--vuga-font-heading, 'Spectral', Georgia, serif); margin: 0 0 .7rem; }
.layout-business-paper .bp-cs-side p { margin: .5rem 0; color: var(--ink-soft); line-height: 1.5; }
.layout-business-paper .bp-cs-side > a { color: var(--accent); font: 700 .68rem/1 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); letter-spacing: .05em; text-transform: uppercase; }
.layout-business-paper .bp-cs-feature { display: block; }
.layout-business-paper .bp-cs-feature .sector-media { aspect-ratio: 3 / 4; }
.layout-business-paper .bp-cs-feature h3 { font: 600 1rem/1.22 var(--vuga-font-heading, 'Spectral', Georgia, serif); margin: .4rem 0 .3rem; }
.layout-business-paper .bp-cs-feature small { color: var(--muted); font: 500 .74rem/1.4 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); }
.layout-business-paper .bp-cs-more { display: block; padding: .8rem 0; border-top: 1px dotted var(--rule); }
.layout-business-paper .bp-cs-more h4 { font: 600 .95rem/1.25 var(--vuga-font-heading, 'Spectral', Georgia, serif); margin: .25rem 0 0; }
.layout-business-paper .bp-cs-all { display: block; margin-top: .8rem; padding-top: .8rem; border-top: 1px dotted var(--rule); }

/* 🔒 Empty approved rubrics publish a Coming soon card instead of a bare
   line; the Most read rail is hidden when there is nothing to list. */
.layout-business-paper .bp-coming-soon { padding: 1.6rem 1.4rem; margin-top: .4rem; border: 1px dashed var(--rule); background: var(--card); }
.layout-business-paper .bp-coming-soon .bp-kicker { margin-top: 0; color: var(--gold); }
.layout-business-paper .bp-coming-soon p { margin: .5rem 0 0; color: var(--ink-soft); line-height: 1.5; }

/* 🔒 Article chrome: breadcrumb, ink rule under the byline, share chips. */
.layout-business-paper .bp-crumb { display: block; margin-bottom: .9rem; font: 700 .72rem/1.3 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.layout-business-paper .bp-crumb a { color: var(--accent); }
.layout-business-paper .bp-byline { border-bottom: 2px solid var(--ink); margin-bottom: 1.2rem; }
.layout-business-paper .bp-share { display: flex; align-items: center; flex-wrap: wrap; gap: .5rem; margin: 1rem 0 0; }
.layout-business-paper .bp-share > span { font: 700 .68rem/1 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); letter-spacing: .08em; text-transform: uppercase; color: var(--muted); margin-right: .2rem; }
.layout-business-paper .bp-share a { border: 1px solid var(--rule); background: var(--card); padding: .45rem .7rem; font: 700 .68rem/1 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); letter-spacing: .06em; text-transform: uppercase; color: var(--ink); }
.layout-business-paper .bp-share a:hover { border-color: var(--accent); color: var(--accent); }
.layout-business-paper .sector-author { background: var(--card); border: 1px solid var(--rule); border-left: 4px solid var(--gold); }

/* 🔒 Utility pages (about, advertise, legal, contact) wear the edition's
   editorial header: interface-font crumb, Spectral headline, ink rule. */
.layout-business-paper .sector-utility-wrap { max-width: 75rem; margin: 0 auto; padding: clamp(1.6rem, 4vw, 3rem) clamp(1rem, 3vw, 2rem) 3.4rem; }
.layout-business-paper .sector-utility .sector-crumb { font: 700 .72rem/1.3 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.layout-business-paper .sector-utility .sector-crumb a { color: var(--accent); }
.layout-business-paper .sector-utility > h1 { font: 700 clamp(2.1rem, 5vw, 3.2rem)/1.05 var(--vuga-font-heading, 'Spectral', Georgia, serif); letter-spacing: 0; margin: .55rem 0 0; padding-bottom: 1.1rem; border-bottom: 2px solid var(--ink); }
.layout-business-paper .sector-utility .sector-utility-intro { font-size: 1.12rem; line-height: 1.6; color: var(--ink-soft); max-width: 44rem; font-family: var(--vuga-font-heading, 'Spectral', Georgia, serif); }
.layout-business-paper .sector-about-body { font-family: var(--vuga-font-heading, 'Spectral', Georgia, serif); }
.layout-business-paper .sector-utility h2 { font-family: var(--vuga-font-heading, 'Spectral', Georgia, serif); }
.layout-business-paper .sector-utility a { text-decoration-color: var(--gold); }

/* 🔒 Contact page: the form speaks the edition's language (one h1 on page). */
.layout-business-paper .sector-utility #contact-page-title { font: 700 clamp(2.1rem, 5vw, 3.2rem)/1.05 var(--vuga-font-heading, 'Spectral', Georgia, serif); margin: .55rem 0 0; padding-bottom: 1.1rem; border-bottom: 2px solid var(--ink); }
.layout-business-paper .vuga-contact-form label { font: 700 .72rem/1.2 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.layout-business-paper .vuga-contact-form input, .layout-business-paper .vuga-contact-form textarea { width: 100%; border: 1px solid var(--rule); padding: .7rem .85rem; font: 400 .95rem/1.4 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); background: var(--card); }
.layout-business-paper .vuga-contact-form input:focus, .layout-business-paper .vuga-contact-form textarea:focus { outline: none; border-color: var(--accent); box-shadow: 0 0 0 2px color-mix(in srgb, var(--accent) 18%, transparent); }
.layout-business-paper .vuga-contact-form button[type="submit"] { border: 0; padding: .8rem 1.4rem; background: var(--ink); color: var(--paper); font: 700 .72rem/1 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); letter-spacing: .07em; text-transform: uppercase; cursor: pointer; }
.layout-business-paper .vuga-contact-form button[type="submit"]:hover { background: var(--accent); }

/* 🔒 Author page in the edition's voice: AUTHOR label, Spectral name over an
   ink rule, portrait tile, sector-card article grid. */
.layout-business-paper .sector-wrap { max-width: 75rem; margin: 0 auto; padding: 1.6rem clamp(1rem, 3vw, 2rem) 3.4rem; }
.layout-business-paper .sector-author-page { display: grid; grid-template-columns: 7.5rem minmax(0, 1fr); gap: 1.6rem; align-items: start; padding-bottom: 1.4rem; border-bottom: 2px solid var(--ink); }
.layout-business-paper .sector-author-page-photo { width: 7.5rem; height: 7.5rem; border-radius: .4rem; object-fit: cover; background: var(--card); }
.layout-business-paper .sector-author-page .sector-kicker { font: 700 .72rem/1.2 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); letter-spacing: .1em; color: var(--gold); }
.layout-business-paper .sector-author-page h1 { font: 700 clamp(2rem, 4.4vw, 3.2rem)/1.05 var(--vuga-font-heading, 'Spectral', Georgia, serif); letter-spacing: 0; margin: .4rem 0 .7rem; }
.layout-business-paper .sector-author-bio { max-width: 44rem; color: var(--ink-soft); line-height: 1.6; font-family: var(--vuga-font-heading, 'Spectral', Georgia, serif); }
.layout-business-paper .sector-author-title, .layout-business-paper .sector-author-credentials { margin: .45rem 0 0; font: 600 .72rem/1.4 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.layout-business-paper .sector-author-title { color: var(--accent); }
.layout-business-paper .sector-section-head { border-bottom: 2px solid var(--ink); }
.layout-business-paper .sector-section-head h2 { font: 700 1.15rem/1 var(--vuga-font-heading, 'Spectral', Georgia, serif); }
.layout-business-paper .sector-card .sector-media { aspect-ratio: 16 / 10; }
.layout-business-paper .sector-card h3 { font: 600 1.05rem/1.22 var(--vuga-font-heading, 'Spectral', Georgia, serif); margin: .45rem 0 .3rem; }
@media (max-width: 640px) { .layout-business-paper .sector-author-page { grid-template-columns: 1fr; } .layout-business-paper .sector-author-page-photo { width: 5.5rem; height: 5.5rem; } }

/* 🔒 Data pages keep the shared data markup, framed by the edition's rules. */
.layout-business-paper .bp-data-main { width: min(75rem, 100% - 2rem); margin: 0 auto; }
.layout-business-paper .bp-data-main .data-breadcrumb { font: 600 .72rem/1.4 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); letter-spacing: .04em; text-transform: uppercase; }
.layout-business-paper .bp-data-main .data-breadcrumb a { color: var(--accent); }
.layout-business-paper .bp-data-main > h1 { font: 700 clamp(2rem, 4.5vw, 3.2rem)/1.05 var(--vuga-font-heading, 'Spectral', Georgia, serif); margin: .4rem 0 1rem; padding-bottom: .9rem; border-bottom: 2px solid var(--ink); }
.layout-business-paper .bp-data-main > .data-capsule { border: 0; border-left: 5px solid var(--gold); background: var(--card); padding: 1rem 1.25rem; margin: 1rem 0 1.5rem; font-family: var(--vuga-font-heading, 'Spectral', Georgia, serif); }
.layout-business-paper .bp-data-main .data-meta div { border-color: var(--rule2); }
.layout-business-paper .bp-data-main .data-table thead { background: var(--ink); }
.layout-business-paper .bp-data-main .data-table th, .layout-business-paper .bp-data-main .data-table td { border-color: var(--rule2); }
.layout-business-paper .bp-data-main .data-table a { color: var(--accent); }
.layout-business-paper .bp-data-main .data-pagination a, .layout-business-paper .bp-data-main .data-pagination > span { border: 1px solid var(--rule); font: 600 .72rem/1 var(--vuga-font-interface, 'IBM Plex Sans', sans-serif); }
.layout-business-paper .bp-data-main .data-attribution { border-top: 3px solid var(--gold); }