/* The shell shared by the three public research pages: /analyst/desk (Research),
   /analyst/portfolio (Portfolios) and /analyst/sector-map (Sector Map).
   One sub-nav, one hero, one paper background, and a cross-document view
   transition so moving between them fades instead of popping: the site header
   and the sub-nav keep their place, the hero text slides softly.
   Load it AFTER a page's own <style> so it wins. */

@view-transition { navigation: auto; }
::view-transition-old(root), ::view-transition-new(root) { animation-duration: .28s; animation-timing-function: ease; }
::view-transition-old(rs-hero-text) { animation: rsOut .22s ease both; }
::view-transition-new(rs-hero-text) { animation: rsIn .38s cubic-bezier(.2,.7,.2,1) both; }
@keyframes rsOut { to { opacity: 0; transform: translateY(-6px); } }
@keyframes rsIn { from { opacity: 0; transform: translateY(10px); } }
#aic-nav, .aic-nav { view-transition-name: aic-header; }
.rs-sub { view-transition-name: rs-sub; }
.rs-hero-bg { view-transition-name: rs-hero-bg; }
.rs-hero-text { view-transition-name: rs-hero-text; }
::view-transition-group(rs-hero-bg) { animation-duration: .35s; }
@media (prefers-reduced-motion: reduce) {
  ::view-transition-group(*), ::view-transition-old(*), ::view-transition-new(*) { animation: none !important; }
}

:root {
  --rs-burg: #66100c; --rs-burg-dk: #4e0c09; --rs-rose: #f0c9c5; --rs-paper: #faf8f4; --rs-line: #e7e1d6;
  --rs-ink: #161312; --rs-muted: #75706b;
  --rs-serif: 'Newsreader', Georgia, serif; --rs-sans: 'Chivo', -apple-system, 'Segoe UI', Roboto, sans-serif;
}
body { background: var(--rs-paper) !important; }

/* ---- Sub-navigation --------------------------------------------------------- */
.rs-sub { background: #fff; border-bottom: 1px solid var(--rs-line); font-family: var(--rs-sans); position: relative; z-index: 4; }
.rs-sub__in { display: flex; gap: 4px; overflow-x: auto; padding: 0 28px; max-width: 1180px; margin: 0 auto; scrollbar-width: none; }
.rs-sub__in::-webkit-scrollbar { display: none; }
.rs-sub a { position: relative; flex: none; font-size: .9rem; font-weight: 700; color: var(--rs-muted); text-decoration: none; padding: 16px 14px 14px; transition: color .2s; }
.rs-sub a::after { content: ''; position: absolute; left: 14px; right: 14px; bottom: -1px; height: 2px; background: var(--rs-burg); transform: scaleX(0); transition: transform .3s cubic-bezier(.2,.7,.2,1); }
.rs-sub a:hover { color: var(--rs-ink); }
.rs-sub a:hover::after { transform: scaleX(.4); background: var(--rs-line); }
.rs-sub a.is-on { color: var(--rs-ink); }
.rs-sub a.is-on::after { transform: scaleX(1); background: var(--rs-burg); }
.rs-sub a:first-child { margin-left: -14px; }

/* ---- Hero ------------------------------------------------------------------- */
.rs-hero { position: relative; z-index: 5; color: #fff; padding: 104px 0 96px; background: #140504; }
/* NOT overflow:hidden: the search dropdown must hang below the hero, over the page. The bark is clipped on its own layer instead. */
.rs-hero-bg { overflow: hidden; }
.rs-hero-bg { position: absolute; inset: 0; background: #140504 url('/research/assets/sector-map/covers/bark-hero.webp') center / cover no-repeat; }
.rs-hero-bg::after { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(16,4,3,.92) 0%, rgba(16,4,3,.72) 45%, rgba(16,4,3,.25) 100%), linear-gradient(0deg, rgba(16,4,3,.6), rgba(16,4,3,0) 40%); }
.rs-hero__in { position: relative; z-index: 2; max-width: 1180px; margin: 0 auto; padding: 0 28px; }
.rs-hero__kick { font-family: var(--rs-sans); font-size: .78rem; font-weight: 700; letter-spacing: .24em; text-transform: uppercase; color: #e8a49e; }
.rs-hero h1.rs-hero__h { font-family: var(--rs-serif); font-weight: 400; font-size: clamp(2.7rem, 5.6vw, 4.9rem); line-height: 1.04; letter-spacing: -.02em; margin: 26px 0 22px; color: #fff; max-width: 13.5em; }
.rs-hero__h em { font-style: italic; color: var(--rs-rose); }
.rs-hero__p { font-family: var(--rs-serif); font-size: 1.24rem; line-height: 1.6; color: #e3d8d4; max-width: 34em; margin: 0 0 34px; }
.rs-hero__acts { display: flex; flex-wrap: wrap; gap: 10px; }
.rs-hbtn { display: inline-flex; align-items: center; gap: 8px; font-family: var(--rs-sans); font-weight: 700; font-size: .92rem; padding: 13px 22px; border-radius: 2px; text-decoration: none; border: 1px solid transparent; transition: background .2s, border-color .2s, transform .2s; }
.rs-hbtn svg { width: 16px; height: 16px; transition: transform .25s; }
.rs-hbtn:hover { transform: translateY(-2px); }
.rs-hbtn:hover svg { transform: translateX(3px); }
.rs-hbtn--p { background: #fff; color: var(--rs-burg); }
.rs-hbtn--p:hover { background: #f6f2ea; }
.rs-hbtn--g { color: #fff; border-color: rgba(255,255,255,.35); }
.rs-hbtn--g:hover { border-color: #fff; }
.rs-hero p.rs-hero__note, .rs-hero__note { font-family: var(--rs-sans); font-size: .88rem; color: #c9b9b4; margin: 22px 0 0; }
.rs-hero__note a { color: #fff; text-decoration: underline; text-underline-offset: 3px; text-decoration-color: rgba(255,255,255,.4); }
.rs-hero__note a:hover { text-decoration-color: #fff; }

/* Entrance: the hero text settles in once, gently, on a fresh load. */
.rs-hero-text > * { animation: rsIn .6s cubic-bezier(.2,.7,.2,1) both; }
.rs-hero-text > *:nth-child(2) { animation-delay: .05s; }
.rs-hero-text > *:nth-child(3) { animation-delay: .1s; }
.rs-hero-text > *:nth-child(4) { animation-delay: .15s; }
.rs-hero-text > *:nth-child(5) { animation-delay: .2s; }
@media (prefers-reduced-motion: reduce) { .rs-hero-text > * { animation: none; } }

@media (max-width: 720px) {
  .rs-sub__in { padding: 0 16px; gap: 0; }
  .rs-sub a { font-size: .8rem; padding: 14px 9px 12px; }
  .rs-sub a::after { left: 9px; right: 9px; }
  .rs-sub a:first-child { margin-left: -9px; }
  .rs-hero { padding: 64px 0 64px; }
  .rs-hero-bg { background-image: url('/research/assets/sector-map/covers/bark-hero-sm.webp'); }
  .rs-hero__in { padding: 0 16px; }
}

/* "The programme" leaves the research section: marked as an outgoing link. */
.rs-sub a.rs-sub__ext { display: inline-flex; align-items: center; gap: 5px; margin-left: auto; }
.rs-sub a.rs-sub__ext .rs-ext { width: 13px; height: 13px; opacity: .7; transition: transform .25s, opacity .25s; }
.rs-sub a.rs-sub__ext:hover .rs-ext { transform: translate(2px,-2px); opacity: 1; }
.rs-sub a.rs-sub__ext::after { display: none; }

/* One-line titles (Vincent, 2026-10-01: "try to make all titles one line"). The longest,
   "Research from the AIC analyst desks", wrapped at 78px; a slightly smaller size keeps
   every publications title on one line on laptop and desktop widths. No nowrap: fifteen
   pages share this hero, and a longer title must wrap rather than run off the screen. */
.rs-hero h1.rs-hero__h { max-width: none; font-size: clamp(2.5rem, 4.4vw, 4.1rem); }
