/* Novastacks blog article + index, revamp skin (2026-10).
   A scoped layer over Blog Template v3: every v3 class (article-wrap, article-layout, article-hero,
   article-sidebar, article-contents, article-prose, key-takeaways, article-faq, service-cta,
   article-related ...) is kept so validate-blog-template.py and validate-eeat.py still see the
   skeleton. Activated by <body class="... rv-page rv-article">; without that class nothing here applies.
   Requires revamp.css (tokens, linen texture, header/footer restyle) loaded first. */

/* ---------- Page and bands ---------- */
.rv-article { background: var(--rv-navy); }
.rv-article .article-wrap { position: relative; isolation: isolate; background: var(--rv-paper); color: var(--rv-navy); font-family: var(--rv-font-body); }
.rv-article .article-wrap::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; mix-blend-mode: multiply;
  background-image: var(--rv-linen-grain),
    repeating-linear-gradient(0deg, rgba(2,6,23,.035) 0 1px, transparent 1px 3px),
    repeating-linear-gradient(90deg, rgba(2,6,23,.03) 0 1px, transparent 1px 3px);
  background-size: 200px 200px, auto, auto; }
.rv-article .article-layout { max-width: 1180px; padding: clamp(40px,6vw,80px) var(--rv-gutter) clamp(64px,8vw,104px); }
@media (min-width: 1024px) {
  /* Reference: TOC rail on the left, reading column (max 720px) on the right. */
  .rv-article .article-layout { grid-template-columns: 250px minmax(0, 720px); column-gap: clamp(40px,5vw,72px); justify-content: center; }
  .rv-article .article-hero    { grid-column: 1 / -1; grid-row: 1; }
  .rv-article .article-sidebar { grid-column: 1; grid-row: 2; top: 5.5rem; max-height: calc(100vh - 7rem); }
  .rv-article .article-prose   { grid-column: 2; grid-row: 2; }
}

/* ---------- Hero ---------- */
.rv-article .article-breadcrumb ol { font-size: 14px; color: var(--rv-ink-soft); }
.rv-article .article-breadcrumb li + li::before { color: var(--rv-ink-soft); }
.rv-article .article-breadcrumb a { color: var(--rv-ink-soft); text-decoration: none; border-bottom: 1px solid rgba(2,6,23,.25); }
.rv-article .article-breadcrumb a:hover { color: var(--rv-teal-dark); }
.rv-article .article-breadcrumb [aria-current="page"] { color: var(--rv-ink-soft); }
/* Content-type badge: mono metadata, not a pill */
.rv-article .article-badge { background: none; border: 0; border-radius: 0; padding: 0; margin: 8px 0 0; display: block;
  font-family: var(--rv-font-mono); font-size: 12px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--rv-teal-dark); }
.rv-article .article-hero h1 { margin-top: 18px; font-family: var(--rv-font-head); font-weight: 500; color: var(--rv-navy);
  font-size: clamp(2.4rem, 6vw, 5.25rem); letter-spacing: -.05em; line-height: .95; max-width: 18ch; text-wrap: balance; }
/* Split title (rollout script): big line + small line, same words as the original H1 */
.rv-article .article-hero h1 .rv-h1-big { display: block; }
.rv-article .article-hero h1 .rv-h1-small { display: block; margin-top: 18px; font-size: clamp(1.3rem, 2.6vw, 2rem); letter-spacing: -.02em; line-height: 1.1; max-width: 40ch; }
.rv-article .article-deck { margin-top: 24px; font-size: clamp(17px,1.5vw,20px); line-height: 1.5; color: var(--rv-ink-soft); max-width: 60ch; }
.rv-article .article-meta { margin-top: 24px; gap: 6px 20px; font-family: var(--rv-font-mono); font-size: 12px; color: var(--rv-ink-soft); }
.rv-article .article-meta .sep { display: none; }
.rv-article .article-meta time { color: var(--rv-ink-soft); }
/* Hero image as a print: white border, deeper bottom, clay hairline, soft shadow (colour kept: blog art carries text) */
.rv-article .article-hero-banner { margin-top: clamp(32px,4vw,48px); border-radius: 0; background: var(--rv-white);
  padding: 10px 10px 28px; outline: 1px solid var(--rv-clay); outline-offset: -5px;
  box-shadow: 0 1px 1px rgba(2,6,23,.08), 0 10px 24px -6px rgba(2,6,23,.22), 0 30px 50px -30px rgba(2,6,23,.3);
  max-width: 1040px; }
.rv-article .article-hero-rule { background: rgba(2,6,23,.14); }
/* Share widgets: square, quiet */
.rv-article .article-share-label, .rv-article .article-llm-share-label { font-family: var(--rv-font-mono); font-size: 12px; font-weight: 500; letter-spacing: 0; text-transform: none; color: var(--rv-ink-soft); }
.rv-article .sw a, .rv-article .sw button { border-radius: 0; }
.rv-article .article-llm-share-btns a { border-radius: 0; background: var(--rv-white); border: 1px solid rgba(2,6,23,.14); color: var(--rv-navy); }
.rv-article .article-llm-share-btns a:hover { border-color: var(--rv-teal-dark); color: var(--rv-teal-dark); }

/* ---------- Sidebar: author, TOC, CTA ---------- */
.rv-article .article-author img { width: 52px; height: 52px; filter: grayscale(1); outline: 1px solid var(--rv-clay); outline-offset: 3px; }
.rv-article .article-author-name { font-family: var(--rv-font-body); color: var(--rv-navy); font-size: 15px; }
.rv-article .article-author-role { color: var(--rv-ink-soft); font-size: 14px; }
.rv-article .article-author-bio { color: var(--rv-ink-soft); font-size: 13px; }
.rv-article .article-sidebar-divider { background: rgba(2,6,23,.12); }
.rv-article .article-contents-label { font-family: var(--rv-font-head); font-weight: 600; font-size: 15px; letter-spacing: -.01em; text-transform: none; color: var(--rv-navy); margin-bottom: 10px; }
.rv-article .article-contents nav { gap: 2px; }
.rv-article .article-contents a { display: block; padding: 8px 0 8px 14px; font-size: 14px; line-height: 1.35; color: var(--rv-ink-soft); text-decoration: none; box-shadow: inset 2px 0 0 rgba(2,6,23,.12); }
.rv-article .article-contents a:hover, .rv-article .article-contents a:focus-visible { color: var(--rv-navy); box-shadow: inset 2px 0 0 var(--rv-teal); }
.rv-article .article-cta { margin-top: 28px; padding: 20px; border: 0; border-radius: 0; background: var(--rv-navy); }
.rv-article .article-cta-title { font-family: var(--rv-font-head); font-weight: 600; font-size: 17px; line-height: 1.25; color: var(--rv-paper); }
.rv-article .article-cta-body { color: var(--rv-paper-text); font-size: 13px; }
.rv-article .article-cta a { color: var(--rv-teal); text-decoration: none; font-size: 14px; font-weight: 500; }
.rv-article .article-cta a:hover { color: var(--rv-paper); }
@media (max-width: 1023px) {
  /* Below desktop the sidebar is a normal block after the hero: no sticky, no overlap. */
  .rv-article .article-sidebar { position: static; max-height: none; overflow: visible; padding: 20px; background: rgba(255,255,255,.6); }
}

/* ---------- Prose ---------- */
.rv-article .article-prose { color: var(--rv-navy); font-size: 18px; line-height: 1.7; }
.rv-article .article-prose p, .rv-article .article-prose li { text-wrap: pretty; }
.rv-article .article-prose h2 { font-family: var(--rv-font-head); font-weight: 500; color: var(--rv-navy);
  font-size: clamp(1.75rem, 3.4vw, 2.5rem); letter-spacing: -.035em; line-height: 1.05; margin-top: 4rem; scroll-margin-top: 6rem; }
.rv-article .article-prose h3 { font-family: var(--rv-font-head); font-weight: 600; color: var(--rv-navy); font-size: 21px; letter-spacing: -.02em; scroll-margin-top: 6rem; }
.rv-article .article-prose a { color: var(--rv-teal-dark); text-decoration-color: rgba(1,125,142,.5); }
.rv-article .article-prose a:hover { color: var(--rv-navy); text-decoration-color: var(--rv-teal); }
.rv-article .article-prose strong { color: var(--rv-navy); }
.rv-article .article-prose li::marker { color: var(--rv-teal-dark); }
.rv-article .article-prose sup { color: var(--rv-ink-soft); }

/* Key takeaways: white card, stacked-plane markers */
.rv-article .key-takeaways { background: var(--rv-white); border: 0; border-radius: 0; padding: clamp(22px,3vw,32px);
  box-shadow: 0 1px 1px rgba(2,6,23,.06), 0 12px 28px -14px rgba(2,6,23,.2); }
.rv-article .key-takeaways .kt-label { font-family: var(--rv-font-head); font-weight: 600; font-size: 20px; letter-spacing: -.02em; text-transform: none; color: var(--rv-navy); margin: 0 0 16px; }
.rv-article .key-takeaways ul { list-style: none; padding: 0; }
.rv-article .key-takeaways li { position: relative; padding-left: 26px; margin-top: 14px; font-size: 16px; line-height: 1.55; color: var(--rv-navy); }
.rv-article .key-takeaways li:first-child { margin-top: 0; }
.rv-article .key-takeaways li::before { content: ''; position: absolute; left: 2px; top: .55em; width: 10px; height: 10px; background: var(--rv-teal); transform: rotateX(60deg) rotateZ(-45deg); }
.rv-article .key-takeaways a { color: var(--rv-teal-dark); }

/* Disclosure + quotes: the human voice (Newsreader italic, deep clay, inset clay rule) */
.rv-article .article-prose .article-disclosure { background: none; border: 0; border-radius: 0; margin: 40px 0; padding: 0 0 0 20px; box-shadow: inset 2px 0 0 var(--rv-clay);
  font-family: var(--rv-font-human); font-style: italic; font-size: clamp(18px,1.9vw,21px); line-height: 1.45; color: var(--rv-clay-deep); }
.rv-article .article-prose .article-disclosure strong { color: var(--rv-clay-deep); font-weight: 500; }
.rv-article .article-prose .article-disclosure a { color: var(--rv-clay-deep); }
.rv-article .article-prose blockquote { border-left: 0; margin: 40px 0; padding: 0 0 0 20px; box-shadow: inset 2px 0 0 var(--rv-clay);
  font-family: var(--rv-font-human); font-style: italic; font-size: clamp(20px,2.2vw,24px); line-height: 1.35; color: var(--rv-clay-deep); }
.rv-article .article-prose blockquote cite, .rv-article .article-prose blockquote .source { font-family: var(--rv-font-body); font-style: normal; font-size: 14px; color: var(--rv-ink-soft); }
.rv-article .article-prose .article-note { border-left: 0; box-shadow: inset 2px 0 0 rgba(2,6,23,.2); color: var(--rv-ink-soft); }

/* Note cards and rubric: white panels, no borders */
.rv-article .article-prose .note-card { background: var(--rv-white); border: 0; border-radius: 0; }
.rv-article .article-prose .note-card .note-card-label { font-family: var(--rv-font-mono); font-size: 12px; letter-spacing: 0; text-transform: none; color: var(--rv-teal-dark); }
.rv-article .article-prose .note-card p { color: var(--rv-navy); }
.rv-article .article-prose details:not(.article-faq details) { background: var(--rv-white); padding: 4px 20px; }

/* Tables: white, navy header row, horizontal scroll inside the wrapper */
.rv-article .article-prose .table-wrap { border: 0; border-radius: 0; background: var(--rv-white); -webkit-overflow-scrolling: touch; }
.rv-article .article-prose table { font-size: 14px; }
.rv-article .article-prose thead th { background: var(--rv-navy); color: var(--rv-paper); font-family: var(--rv-font-head); font-weight: 500; }
.rv-article .article-prose tbody td { border-bottom-color: rgba(2,6,23,.08); color: var(--rv-ink-soft); }
.rv-article .article-prose tbody td:first-child { color: var(--rv-navy); }
.rv-article .article-prose tbody tr:nth-child(even) td { background: rgba(239,241,239,.5); }

/* Figures and in-body images */
.rv-article .article-prose figure img, .rv-article .article-prose > section img { border-radius: 0; }
.rv-article .article-prose figcaption { font-family: var(--rv-font-mono); font-size: 12px; color: var(--rv-ink-soft); }

/* Stat strip: big Space Grotesk numbers */
.rv-article .article-prose .stat-strip .stat { border-left-color: rgba(2,6,23,.14); }
.rv-article .article-prose .stat-strip .stat strong { font-weight: 500; font-size: clamp(2.2rem,4vw,3rem); letter-spacing: -.05em; line-height: .95; }
.rv-article .article-prose .stat-strip .stat span { color: var(--rv-ink-soft); }
.rv-article .article-prose .rank-badge { border-radius: 0; background: var(--rv-navy); color: var(--rv-paper); font-family: var(--rv-font-mono); }

/* FAQ rows */
.rv-article .article-prose .article-faq details { border-top: 1px solid rgba(2,6,23,.16); }
.rv-article .article-prose .article-faq details:last-child { border-bottom: 1px solid rgba(2,6,23,.16); }
.rv-article .article-prose .article-faq summary h3 { font-family: var(--rv-font-head); font-weight: 500; font-size: clamp(17px,1.8vw,19px); }
.rv-article .article-prose .article-faq summary::after { color: var(--rv-teal-dark); }

/* Sources */
.rv-article .article-sources { border-top-color: rgba(2,6,23,.16); }
.rv-article .article-sources-label { font-family: var(--rv-font-head); font-weight: 600; font-size: 15px; letter-spacing: 0; text-transform: none; color: var(--rv-navy); }
.rv-article .article-sources ol { color: var(--rv-ink-soft); }

/* In-article CTA: the teal band (pressable buttons) */
.rv-article .service-cta { margin-top: clamp(56px,7vw,88px); background: var(--rv-teal); border-radius: 0; padding: clamp(32px,5vw,56px); text-align: left; }
.rv-article .service-cta h2, .rv-article .service-cta .service-cta-title { margin: 0; font-family: var(--rv-font-head); font-weight: 500; color: var(--rv-navy);
  font-size: clamp(1.9rem, 4.2vw, 3rem); letter-spacing: -.04em; line-height: .98; }
.rv-article .service-cta p { margin: 18px 0 0; max-width: 46ch; color: var(--rv-navy); font-size: 17px; }
.rv-article .service-cta-actions { justify-content: flex-start; gap: 20px 24px; margin-top: 28px; align-items: center; }
.rv-article .service-cta-primary { display: inline-flex; align-items: center; min-height: 52px; padding: 16px 22px; border-radius: 0; background: var(--rv-navy); color: var(--rv-paper);
  font-family: var(--rv-font-head); font-weight: 600; box-shadow: 5px 5px 0 var(--rv-teal-dark); transition: transform .12s, box-shadow .12s; text-decoration: none; }
.rv-article .service-cta-primary:hover { background: var(--rv-navy); color: var(--rv-paper); transform: translate(-2px,-2px); box-shadow: 7px 7px 0 var(--rv-teal-dark); }
.rv-article .service-cta-primary:active { transform: translate(5px,5px); box-shadow: 0 0 0 var(--rv-teal-dark); }
.rv-article .service-cta-secondary { background: none; padding: 6px 0; border-radius: 0; color: var(--rv-navy); border-bottom: 1px solid var(--rv-navy); font-weight: 500; text-decoration: none; }
.rv-article .service-cta-secondary:hover { background: none; color: var(--rv-navy); }

/* ---------- Related guides: paper band, white cards with offset hover ---------- */
.rv-article .article-related { position: relative; isolation: isolate; background: var(--rv-paper); border-top: 0; }
.rv-article .article-related::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; mix-blend-mode: multiply;
  background-image: var(--rv-linen-grain); background-size: 200px 200px; }
.rv-article .article-related-inner { max-width: 1180px; padding: clamp(56px,8vw,104px) var(--rv-gutter); }
.rv-article .article-related-label { font-family: var(--rv-font-head); font-weight: 500; font-size: clamp(1.75rem,3.4vw,2.5rem); letter-spacing: -.035em; text-transform: none; color: var(--rv-navy); margin-bottom: 32px; }
.rv-article .article-related-list { grid-template-columns: repeat(auto-fit, minmax(min(100%,300px),1fr)); gap: 20px; }
.rv-article .article-related-item { display: flex; flex-direction: column-reverse; justify-content: flex-end; gap: 10px; padding: 24px; border: 0; background: var(--rv-white); color: var(--rv-navy);
  transition: transform .2s, box-shadow .2s; text-decoration: none; }
.rv-article .article-related-item:hover { transform: translate(-4px,-4px); box-shadow: 8px 8px 0 var(--rv-teal-dark); }
.rv-article .article-related-title { font-family: var(--rv-font-head); font-weight: 600; font-size: 20px; letter-spacing: -.02em; line-height: 1.2; color: var(--rv-navy); }
.rv-article .article-related-desc { margin-top: 10px; font-size: 15px; color: var(--rv-ink-soft); }
.rv-article .article-related-tag { padding: 0; font-family: var(--rv-font-mono); font-size: 12px; letter-spacing: 0; text-transform: none; color: var(--rv-teal-dark); }

@media (prefers-reduced-motion: reduce) {
  .rv-article .service-cta-primary, .rv-article .article-related-item { transition: none; }
  .rv-article .service-cta-primary:hover, .rv-article .article-related-item:hover { transform: none; }
}

/* revamp.css restyles every <header> as the dark site header; the article hero is a <header> too. */
.rv-article header.article-hero { background: transparent !important; border-bottom: 0 !important; }
.rv-article header.article-hero nav a { font-family: var(--rv-font-body) !important; font-size: 14px !important; color: var(--rv-ink-soft) !important; }
.rv-article header.article-hero nav a:hover { color: var(--rv-teal-dark) !important; }
.rv-article header.article-hero a[href*="contact"], .rv-article header.article-hero a[href*="calendar"] { background: none !important; box-shadow: none !important; color: var(--rv-teal-dark) !important; font-family: inherit !important; }
/* CTA links sit inside .article-prose on some posts; beat `.article-prose a` */
.rv-article .service-cta a.service-cta-primary { color: var(--rv-paper); text-decoration: none; }
.rv-article .service-cta a.service-cta-primary:hover { color: var(--rv-paper); }
.rv-article .service-cta a.service-cta-secondary { color: var(--rv-navy); text-decoration: none; border-bottom: 1px solid var(--rv-navy); }

/* =====================================================================
   Blog index (/blog/), revamp skin. Activated by <body class="... rv-page rv-blog-index">.
   The hub markup is maintained by scripts/rebuild-blog-index.py, which re-parses the existing
   structure and reuses card markup verbatim, so this skin is CSS only (no markup or copy change).
   Body sections, in order: 1 hero, 2 category nav, 3 featured, 4-10 category carousels,
   11 why read, 12 popular topics, 13 work with us.
   Bands: dark, dark strip, paper, then alternating, why = paper, topics = dark, CTA = teal.
   ===================================================================== */
.rv-blog-index { background: var(--rv-navy); font-family: var(--rv-font-body); }
.rv-blog-index > section { position: relative; isolation: isolate; background: var(--rv-navy) !important; border: 0 !important; }
.rv-blog-index > section > .container { max-width: 1280px; padding-left: var(--rv-gutter); padding-right: var(--rv-gutter); }
.rv-blog-index > section:not(:nth-of-type(2)) { padding-top: clamp(64px,8vw,112px); padding-bottom: clamp(64px,8vw,112px); }
.rv-blog-index > section:is(:nth-of-type(3), :nth-of-type(5), :nth-of-type(7), :nth-of-type(9), :nth-of-type(11)) { background: var(--rv-paper) !important; color: var(--rv-navy); }
.rv-blog-index > section:is(:nth-of-type(3), :nth-of-type(5), :nth-of-type(7), :nth-of-type(9), :nth-of-type(11))::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; mix-blend-mode: multiply;
  background-image: var(--rv-linen-grain), repeating-linear-gradient(0deg, rgba(2,6,23,.035) 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg, rgba(2,6,23,.03) 0 1px, transparent 1px 3px);
  background-size: 200px 200px, auto, auto; }
.rv-blog-index > section:nth-of-type(13) { background: var(--rv-teal) !important; color: var(--rv-navy); }

/* Type */
.rv-blog-index h1 { font-family: var(--rv-font-head) !important; font-weight: 500 !important; font-size: clamp(2.6rem,7vw,6rem) !important; letter-spacing: -.05em; line-height: .92 !important; color: var(--rv-paper); max-width: 16ch; }
.rv-blog-index > section:nth-of-type(1) .max-w-3xl { max-width: 980px; }
.rv-blog-index > section:nth-of-type(1) p:not(.font-mono) { max-width: 60ch; font-size: clamp(16px,1.4vw,19px); line-height: 1.55; color: var(--rv-paper-text) !important; }
.rv-blog-index > section h2 { font-family: var(--rv-font-head) !important; font-weight: 500 !important; font-size: clamp(2rem,4.6vw,3.5rem) !important; letter-spacing: -.04em; line-height: 1; }
.rv-blog-index > section h2 a { color: inherit !important; }
.rv-blog-index p.font-mono { font-family: var(--rv-font-mono) !important; font-size: 12px !important; letter-spacing: 0 !important; color: var(--rv-teal) !important; }
.rv-blog-index > section:is(:nth-of-type(3), :nth-of-type(5), :nth-of-type(7), :nth-of-type(9), :nth-of-type(11)) p.font-mono { color: var(--rv-teal-dark) !important; }
.rv-blog-index > section:is(:nth-of-type(3), :nth-of-type(5), :nth-of-type(7), :nth-of-type(9), :nth-of-type(11)) :is(h2, h3) { color: var(--rv-navy) !important; }
.rv-blog-index > section:is(:nth-of-type(3), :nth-of-type(5), :nth-of-type(7), :nth-of-type(9), :nth-of-type(11)) :is(p, span, div) { color: var(--rv-ink-soft); }
.rv-blog-index > section:is(:nth-of-type(3), :nth-of-type(5), :nth-of-type(7), :nth-of-type(9), :nth-of-type(11)) a.text-novastacks { color: var(--rv-teal-dark) !important; }

/* Category filter: square chips on a dark strip */
.rv-blog-index > section:nth-of-type(2) { background: var(--rv-navy-raised) !important; }
.rv-blog-index > section:nth-of-type(2) a { border-radius: 0 !important; min-height: 44px; display: inline-flex; align-items: center; font-family: var(--rv-font-mono); font-size: 13px !important; font-weight: 500;
  background: transparent !important; color: rgba(239,241,239,.8) !important; box-shadow: inset 0 0 0 1px rgba(239,241,239,.2); }
.rv-blog-index > section:nth-of-type(2) a:hover { color: var(--rv-paper) !important; box-shadow: inset 0 0 0 1px var(--rv-teal); }
.rv-blog-index > section:nth-of-type(2) a[href="/blog/"] { background: var(--rv-teal) !important; color: var(--rv-navy) !important; box-shadow: none; }

/* Article cards */
.rv-blog-index article.blog-post > a > div { border: 0 !important; border-radius: 0 !important; background: var(--rv-navy-raised) !important; transition: transform .2s, box-shadow .2s; height: 100%; }
.rv-blog-index article.blog-post > a:hover > div { transform: translate(-4px,-4px); box-shadow: 8px 8px 0 var(--rv-teal); }
.rv-blog-index > section:is(:nth-of-type(3), :nth-of-type(5), :nth-of-type(7), :nth-of-type(9), :nth-of-type(11)) article.blog-post > a > div { background: var(--rv-white) !important; box-shadow: 0 1px 1px rgba(2,6,23,.06), 0 12px 28px -14px rgba(2,6,23,.2); }
.rv-blog-index > section:is(:nth-of-type(3), :nth-of-type(5), :nth-of-type(7), :nth-of-type(9), :nth-of-type(11)) article.blog-post > a:hover > div { box-shadow: 8px 8px 0 var(--rv-teal-dark); }
.rv-blog-index article.blog-post .aspect-video { border-radius: 0; }
.rv-blog-index article.blog-post h3 { font-family: var(--rv-font-head); font-weight: 600 !important; letter-spacing: -.02em; line-height: 1.2; }
.rv-blog-index article.blog-post [class*="bg-novastacks/10"] { background: none !important; padding: 0 !important; border-radius: 0 !important; font-family: var(--rv-font-mono); font-weight: 500 !important; color: var(--rv-teal) !important; }
.rv-blog-index > section:is(:nth-of-type(3), :nth-of-type(5), :nth-of-type(7), :nth-of-type(9), :nth-of-type(11)) article.blog-post [class*="bg-novastacks/10"] { color: var(--rv-teal-dark) !important; }
.rv-blog-index article.blog-post .text-xs, .rv-blog-index article.blog-post .text-sm.text-slate-500 { font-family: var(--rv-font-mono); }
.rv-blog-index article.blog-post .text-novastacks { color: var(--rv-teal) !important; }
.rv-blog-index > section:is(:nth-of-type(3), :nth-of-type(5), :nth-of-type(7), :nth-of-type(9), :nth-of-type(11)) article.blog-post .text-novastacks { color: var(--rv-teal-dark) !important; }

/* Why read: white panels on paper, no icon tiles */
.rv-blog-index > section:nth-of-type(11) .grid > div { background: var(--rv-white) !important; border: 0 !important; border-radius: 0 !important; }
.rv-blog-index > section:nth-of-type(11) .grid > div > div:first-child { background: none !important; width: auto; height: auto; justify-content: flex-start; }
.rv-blog-index > section:nth-of-type(11) .grid > div svg { color: var(--rv-teal-dark); }
.rv-blog-index > section:nth-of-type(11) h3 { font-family: var(--rv-font-head); font-weight: 600 !important; font-size: 19px; }

/* Popular topics: square chips */
.rv-blog-index > section:nth-of-type(12) .flex a { border-radius: 0 !important; background: transparent !important; color: rgba(239,241,239,.85) !important; box-shadow: inset 0 0 0 1px rgba(239,241,239,.22); min-height: 44px; display: inline-flex; align-items: center; }
.rv-blog-index > section:nth-of-type(12) .flex a:hover { box-shadow: inset 0 0 0 1px var(--rv-teal); color: var(--rv-paper) !important; }

/* Work with us: teal band, pressable navy button + text link */
.rv-blog-index > section:nth-of-type(13) .container { text-align: left !important; }
.rv-blog-index > section:nth-of-type(13) h2 { color: var(--rv-navy) !important; font-size: clamp(2.6rem,7vw,5.5rem) !important; line-height: .9; }
.rv-blog-index > section:nth-of-type(13) p:not(.font-mono) { color: var(--rv-navy) !important; margin-left: 0 !important; font-size: 17px; }
.rv-blog-index > section:nth-of-type(13) p.font-mono { color: var(--rv-navy) !important; }
.rv-blog-index > section:nth-of-type(13) .flex { justify-content: flex-start !important; align-items: center; gap: 24px; }
.rv-blog-index > section:nth-of-type(13) .flex a:first-child { border-radius: 0 !important; background: var(--rv-navy) !important; color: var(--rv-paper) !important; font-family: var(--rv-font-head); font-weight: 600; min-height: 52px; display: inline-flex; align-items: center; box-shadow: 5px 5px 0 var(--rv-teal-dark); transition: transform .12s, box-shadow .12s; }
.rv-blog-index > section:nth-of-type(13) .flex a:first-child:hover { transform: translate(-2px,-2px); box-shadow: 7px 7px 0 var(--rv-teal-dark); }
.rv-blog-index > section:nth-of-type(13) .flex a:last-child { border: 0 !important; border-bottom: 1px solid var(--rv-navy) !important; border-radius: 0 !important; background: none !important; padding: 6px 0 !important; color: var(--rv-navy) !important; }
@media (prefers-reduced-motion: reduce) { .rv-blog-index article.blog-post > a > div, .rv-blog-index > section:nth-of-type(13) .flex a { transition: none; } }
.rv-blog-index h1 { margin-bottom: 28px !important; }
.rv-blog-index > footer { overflow-x: clip; } /* hidden footer dropdown (pre-existing) overflowed 13px at 390 */
/* Index headings: category name as the small lead line, existing heading as the big line */
.rv-blog-index .rv-idx-lead { display: block; margin-bottom: .35em; font-family: var(--rv-font-head); font-weight: 500; font-size: clamp(1.1rem,2vw,1.5rem); letter-spacing: -.02em; line-height: 1.1; color: rgba(239,241,239,.86); }
.rv-blog-index > section:is(:nth-of-type(3), :nth-of-type(5), :nth-of-type(7), :nth-of-type(9), :nth-of-type(11)) .rv-idx-lead { color: var(--rv-navy); }
.rv-blog-index h1 .rv-idx-lead { font-size: clamp(1.4rem,3vw,2.5rem); letter-spacing: -.025em; }
/* Legacy wrappers on 11 older posts: an empty dark breadcrumb bar and a dark padded wrapper around .article-wrap */
.rv-article > div.bg-slate-900:empty { display: none; }
.rv-article > div:has(> .article-wrap) { background: transparent !important; padding: 0 !important; }

/* =====================================================================
   Blog category listing pages (/blog/aeo, /blog/ai-search, ...), revamp skin.
   Activated by <body class="... rv-page rv-blog-cat">, applied and kept by scripts/rebuild-blog-index.py.
   Sections: breadcrumb (dark), hero (dark), category filter (raised strip), post grid(s) (paper), CTA (teal).
   ===================================================================== */
.rv-blog-cat { background: var(--rv-navy); font-family: var(--rv-font-body); }
.rv-blog-cat > section { position: relative; isolation: isolate; border: 0 !important; background: var(--rv-navy) !important; }
.rv-blog-cat > section > .container { max-width: 1280px; padding-left: var(--rv-gutter); padding-right: var(--rv-gutter); }
.rv-blog-cat > section:nth-of-type(1) { padding-top: 28px; }
.rv-blog-cat > section:nth-of-type(1) nav, .rv-blog-cat > section:nth-of-type(1) a { font-size: 14px; color: rgba(239,241,239,.7) !important; }
.rv-blog-cat > section:nth-of-type(2) { padding-top: clamp(40px,6vw,80px) !important; padding-bottom: clamp(56px,7vw,96px) !important; }
.rv-blog-cat h1 { font-family: var(--rv-font-head) !important; font-weight: 500 !important; font-size: clamp(2.6rem,7vw,6rem) !important; letter-spacing: -.05em; line-height: .92 !important; color: var(--rv-paper); max-width: 16ch; margin-bottom: 24px !important; }
.rv-blog-cat > section:nth-of-type(2) p { max-width: 60ch; font-size: clamp(16px,1.4vw,19px); line-height: 1.55; color: var(--rv-paper-text) !important; }
.rv-blog-cat > section:nth-of-type(3) { background: var(--rv-navy-raised) !important; }
.rv-blog-cat > section:nth-of-type(3) a { border-radius: 0 !important; min-height: 44px; display: inline-flex; align-items: center; font-family: var(--rv-font-mono); font-size: 13px !important;
  background: transparent !important; color: rgba(239,241,239,.8) !important; box-shadow: inset 0 0 0 1px rgba(239,241,239,.2); }
.rv-blog-cat > section:nth-of-type(3) a[class*="bg-novastacks"] { background: var(--rv-teal) !important; color: var(--rv-navy) !important; box-shadow: none; }
.rv-blog-cat > section:has(article.blog-post) { background: var(--rv-paper) !important; color: var(--rv-navy); padding-top: clamp(56px,7vw,96px) !important; padding-bottom: clamp(56px,7vw,96px) !important; }
.rv-blog-cat > section:has(article.blog-post)::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; mix-blend-mode: multiply;
  background-image: var(--rv-linen-grain), repeating-linear-gradient(0deg, rgba(2,6,23,.035) 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg, rgba(2,6,23,.03) 0 1px, transparent 1px 3px);
  background-size: 200px 200px, auto, auto; }
.rv-blog-cat > section:has(article.blog-post) :is(h2, h3) { color: var(--rv-navy) !important; font-family: var(--rv-font-head); }
.rv-blog-cat > section:has(article.blog-post) :is(p, span, div) { color: var(--rv-ink-soft); }
.rv-blog-cat article.blog-post > a > div { border: 0 !important; border-radius: 0 !important; background: var(--rv-white) !important; height: 100%;
  box-shadow: 0 1px 1px rgba(2,6,23,.06), 0 12px 28px -14px rgba(2,6,23,.2); transition: transform .2s, box-shadow .2s; }
.rv-blog-cat article.blog-post > a:hover > div { transform: translate(-4px,-4px); box-shadow: 8px 8px 0 var(--rv-teal-dark); }
.rv-blog-cat article.blog-post h3 { font-weight: 600 !important; letter-spacing: -.02em; line-height: 1.2; }
.rv-blog-cat article.blog-post [class*="bg-novastacks/10"] { background: none !important; padding: 0 !important; border-radius: 0 !important; font-family: var(--rv-font-mono); color: var(--rv-teal-dark) !important; }
.rv-blog-cat article.blog-post .text-novastacks { color: var(--rv-teal-dark) !important; }
.rv-blog-cat article.blog-post .text-xs { font-family: var(--rv-font-mono); }
.rv-blog-cat > section:last-of-type { background: var(--rv-teal) !important; color: var(--rv-navy); padding-top: clamp(72px,9vw,120px) !important; padding-bottom: clamp(72px,9vw,120px) !important; }
.rv-blog-cat > section:last-of-type .container { text-align: left !important; }
.rv-blog-cat > section:last-of-type h2 { font-family: var(--rv-font-head) !important; font-weight: 500 !important; font-size: clamp(2.2rem,5.5vw,4.5rem) !important; letter-spacing: -.04em; line-height: .95; color: var(--rv-navy) !important; max-width: 18ch; }
.rv-blog-cat > section:last-of-type p { color: var(--rv-navy) !important; margin-left: 0 !important; }
.rv-blog-cat > section:last-of-type .flex { justify-content: flex-start !important; }
.rv-blog-cat > section:last-of-type a:first-of-type { border-radius: 0 !important; background: var(--rv-navy) !important; color: var(--rv-paper) !important; font-family: var(--rv-font-head); font-weight: 600; min-height: 52px; display: inline-flex; align-items: center; box-shadow: 5px 5px 0 var(--rv-teal-dark); }
.rv-blog-cat > footer { overflow-x: clip; }
@media (prefers-reduced-motion: reduce) { .rv-blog-cat article.blog-post > a > div { transition: none; } }
/* Category CTA: the live dark inner card sits on the teal band; flatten it */
.rv-blog-cat > section:last-of-type .container > div { background: transparent !important; border: 0 !important; padding: 0 !important; max-width: none; }
.rv-blog-cat > section:last-of-type h2 { margin-bottom: 20px !important; }
/* Study stat strip on a paper band */
.rv-blog-cat > section:has(article.blog-post) .grid.gap-px { background: rgba(2,6,23,.12) !important; border: 0 !important; border-radius: 0 !important; }
.rv-blog-cat > section:has(article.blog-post) .grid.gap-px > div { background: var(--rv-white) !important; }
.rv-blog-cat > section:has(article.blog-post) .grid.gap-px > div :first-child { color: var(--rv-navy) !important; font-family: var(--rv-font-head); font-weight: 500; letter-spacing: -.03em; }

/* =====================================================================
   Frozen pre-v3 pages (top-aeo-agencies-singapore, best-aeo-tools-2026, aeo-study-august-2026),
   hand-skinned. Activated by <body class="... rv-page rv-frozen">. Markup and text untouched;
   these pages stay excluded from the v3 validators.
   ===================================================================== */
.rv-frozen { background: var(--rv-navy); font-family: var(--rv-font-body); }
/* `// LABEL` eyebrows: hidden by the skin (text stays in the HTML; brand style bans them) */
.rv-frozen p.font-mono.tracking-wider { display: none; }
.rv-frozen :is(header, section).bg-slate-950, .rv-frozen :is(header, section).bg-slate-900 { background: var(--rv-navy) !important; border-color: transparent !important; }
.rv-frozen article > header { border-bottom: 0 !important; }
.rv-frozen h1 { font-family: var(--rv-font-head) !important; font-weight: 500 !important; font-size: clamp(2.4rem,6vw,5rem) !important; letter-spacing: -.05em; line-height: .95 !important; color: var(--rv-paper) !important; text-wrap: balance; }
.rv-frozen h1 .rv-h1-big { display: block; }
.rv-frozen h1 .rv-h1-small { display: block; margin-top: 16px; font-size: clamp(1.25rem,2.4vw,1.9rem); letter-spacing: -.02em; line-height: 1.1; color: rgba(239,241,239,.86); }
.rv-frozen header p.text-xl, .rv-frozen section.bg-slate-950 p.text-lg { color: var(--rv-paper-text) !important; }
.rv-frozen .article-hero-banner { border-radius: 0 !important; background: var(--rv-white); padding: 10px 10px 28px; outline: 1px solid var(--rv-clay); outline-offset: -5px; margin-top: 28px; }
/* Light body sections -> linen paper */
.rv-frozen :is(section, div).bg-slate-100, .rv-frozen article > div.bg-white, .rv-frozen article > section.bg-white { position: relative; isolation: isolate; background: var(--rv-paper) !important; border-color: transparent !important; }
.rv-frozen section.bg-slate-100::before { content: ''; position: absolute; inset: 0; z-index: -1; pointer-events: none; mix-blend-mode: multiply;
  background-image: var(--rv-linen-grain), repeating-linear-gradient(0deg, rgba(2,6,23,.035) 0 1px, transparent 1px 3px), repeating-linear-gradient(90deg, rgba(2,6,23,.03) 0 1px, transparent 1px 3px); background-size: 200px 200px, auto, auto; }
.rv-frozen article :is(h2, h3) { font-family: var(--rv-font-head) !important; letter-spacing: -.03em; }
.rv-frozen article h2 { font-weight: 500 !important; }
.rv-frozen [class*="rounded"] { border-radius: 0 !important; }
.rv-frozen .article-toc { border: 0 !important; box-shadow: 0 1px 1px rgba(2,6,23,.06), 0 12px 28px -14px rgba(2,6,23,.2); }
.rv-frozen [class*="border-l-4"] { border-left-color: var(--rv-teal) !important; }
.rv-frozen table thead tr, .rv-frozen table thead th { background: var(--rv-navy) !important; color: var(--rv-paper) !important; }
.rv-frozen [class*="bg-gradient-to-br"] { background: var(--rv-teal) !important; text-align: left !important; }
.rv-frozen [class*="bg-gradient-to-br"] :is(h2, h3, p) { color: var(--rv-navy) !important; }
.rv-frozen [class*="bg-gradient-to-br"] a { background: var(--rv-navy) !important; color: var(--rv-paper) !important; box-shadow: 5px 5px 0 var(--rv-teal-dark); }
.rv-frozen > footer { overflow-x: clip; }
