/* Impact Bridge V3 — immersive layer over the base styles (ib.css). */

/* ── Global ─────────────────────────────────────────────── */
html { scroll-behavior: auto !important; }
html, body { overflow-x: clip; }
html.lenis, html.lenis body { height: auto; }
.lenis.lenis-smooth [data-lenis-prevent] { overscroll-behavior: contain; }
.lenis.lenis-stopped { overflow: clip; }

:root { --fs-display: clamp(3.4rem, 10vw, 11rem); --radius: clamp(20px, 3vw, 44px); --deepest: #203B2E; --open: #437C90; }
.status--open { color: var(--teal); }

/* Word masks for split titles. Padding/negative margin keep descenders and italic overhang uncut. */
.w { display: inline-block; overflow: clip; vertical-align: top; padding: .08em .08em .2em; margin: -.08em -.08em -.2em; }
.w__i { display: inline-block; will-change: transform; transform-origin: left bottom; }
.is-scrub .w, [data-scrub-words] .w { overflow: visible; }

.progress3 { position: fixed; inset: 0 0 auto; height: 2px; z-index: 70; background: var(--teal); transform: scaleX(0); transform-origin: left; pointer-events: none; }

.cursor3 {
  position: fixed; left: 0; top: 0; width: 18px; height: 18px; z-index: 90; pointer-events: none; border-radius: 50%;
  border: 1.5px solid #fff; mix-blend-mode: difference;
  transition: width .35s var(--ease), height .35s var(--ease), background-color .35s;
}
.cursor3.is-link { width: 54px; height: 54px; }
.cursor3.is-media { width: 96px; height: 96px; background: rgba(255, 255, 255, .14); }

/* Page transitions between documents (Chromium / Safari). */
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: vt-out .4s var(--ease) both; }
::view-transition-new(root) { animation: vt-in .6s var(--ease) both; }
@keyframes vt-out { to { opacity: 0; transform: translateY(-28px) scale(.985); } }
@keyframes vt-in { from { opacity: 0; transform: translateY(36px); } }

/* ── Intro (first visit of the session; CSS-only, so it can never get stuck) ── */
.intro3 { display: none; }
.js:not(.no-intro) .intro3 {
  display: grid; place-items: center; position: fixed; inset: 0; z-index: 100; background: var(--deepest); pointer-events: none;
  animation: intro-out .8s cubic-bezier(.76, 0, .24, 1) 1.15s forwards;
}
.intro3 svg { width: clamp(120px, 15vw, 200px); overflow: visible; stroke: var(--bone); stroke-width: 1.2; stroke-linecap: round; }
.intro3 path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: intro-draw 1s var(--ease) .1s forwards; }
.intro3__pylon, .intro3__deck { stroke-width: 2; }
@keyframes intro-draw { to { stroke-dashoffset: 0; } }
@keyframes intro-out { to { clip-path: inset(0 0 100% 0); visibility: hidden; } }
.intro3 { clip-path: inset(0); }

/* ── Header: floats over dark heroes, glass once you scroll ───────────────── */
.site-header {
  position: fixed; left: 0; right: 0; top: 0;
  transition: transform .5s var(--ease), background-color .35s, border-color .35s, color .35s;
  background: rgba(255, 255, 255, .78); -webkit-backdrop-filter: blur(18px) saturate(1.4); backdrop-filter: blur(18px) saturate(1.4);
}
.site-header.is-hidden { transform: translateY(-101%); }
main { padding-top: var(--header-h); position: relative; z-index: 2; background: var(--bg); }

  background: transparent; border-bottom-color: transparent; -webkit-backdrop-filter: none; backdrop-filter: none;
}

/* ── Hero: live bridge ──────────────────────────────────── */
.hero3 { height: 240vh; background: var(--deep); }
.hero3__stage { position: sticky; top: 0; height: 100vh; height: 100lvh; overflow: hidden; color: #fff; }
.hero3__media { position: absolute; inset: 0; background: linear-gradient(180deg, #203B2E 0%, #437C90 56%, #94C3C4 60%, #437C90 66%, #203B2E 100%); }
.hero3__bridge { position: absolute; inset: 0; width: 100%; height: 100%; display: block; }
.hero3__fade { position: absolute; inset: 0; background: var(--deep); opacity: 0; pointer-events: none; }
.hero3__shade { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(32, 59, 46, .82) 0%, rgba(32, 59, 46, .5) 32%, rgba(32, 59, 46, 0) 52%); }
.hero3__content { position: absolute; left: 0; right: 0; bottom: clamp(36px, 7vh, 88px); margin-inline: auto; width: 100%; }
.hero3__eyebrow { color: #fff; margin-bottom: clamp(16px, 2.4vh, 28px); }
.hero3__title { font-family: var(--serif); font-size: var(--fs-display); line-height: .94; letter-spacing: -.028em; text-wrap: balance; font-weight: 400; }
.hero3__title em { color: var(--mist); }
.hero3__title .keep { white-space: nowrap; }
.hero3__cue { position: absolute; right: var(--gutter); bottom: clamp(36px, 7vh, 88px); width: 1px; height: 72px; background: rgba(255, 255, 255, .3); overflow: hidden; }
.hero3__cue i { display: block; width: 100%; height: 40%; background: #fff; animation: cue 2.2s cubic-bezier(.76, 0, .24, 1) infinite; }
@keyframes cue { from { transform: translateY(-100%); } to { transform: translateY(260%); } }

/* ── Manifest + metrics ─────────────────────────────────── */
.manifest3 { background: var(--deep); color: var(--bone); padding-block: clamp(80px, 12vw, 180px) clamp(64px, 8vw, 120px); position: relative; }
.manifest3__text { font-family: var(--serif); font-size: clamp(2.1rem, 5.2vw, 5.4rem); line-height: 1.06; letter-spacing: -.02em; max-width: 22em; }
.manifest3 .metrics { padding-block: clamp(72px, 10vw, 150px) 0; }
.manifest3 .metric__label { color: var(--mist); }

/* ── Strategies: horizontal travel ──────────────────────── */
.strat3 { background: var(--bone); position: relative; border-radius: var(--radius) var(--radius) 0 0; margin-top: calc(-1 * var(--radius)); z-index: 1; }
.strat3__stage { position: sticky; top: 0; height: 100vh; height: 100svh; overflow: hidden; display: flex; align-items: center; border-radius: inherit; }
.strat3__track { display: flex; align-items: stretch; gap: clamp(16px, 2vw, 32px); padding-inline: var(--gutter) 12vw; will-change: transform; }
.strat3__intro { flex: none; width: min(46vw, 720px); display: flex; flex-direction: column; justify-content: center; gap: 28px; padding-right: 4vw; }
.strat3__intro .lead { max-width: 36ch; color: var(--ink-2); }
.fund3 { flex: none; width: min(60vw, 900px); height: min(76vh, 760px); position: relative; overflow: hidden; border-radius: var(--radius); color: #fff; display: flex; flex-direction: column; justify-content: space-between; padding: clamp(22px, 2.6vw, 40px); isolation: isolate; }
.fund3:hover { color: #fff; }
.fund3__media { position: absolute; inset: 0; z-index: -1; background: var(--deep); overflow: hidden; }
.fund3__media img { position: absolute; inset: 0 -9%; width: 118%; max-width: none; height: 100%; object-fit: cover; transition: scale 1.1s var(--ease); }
.fund3:hover .fund3__media img { scale: 1.06; }
.fund3__media::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(32, 59, 46, .92) 0%, rgba(32, 59, 46, .66) 42%, rgba(32, 59, 46, .22) 72%, rgba(32, 59, 46, .4) 100%); }
.fund3__top { display: flex; justify-content: space-between; align-items: flex-start; }
.fund3__n { font-size: .875rem; font-variant-numeric: tabular-nums; }
.fund3__size { font-family: var(--serif); font-size: clamp(3rem, 6.4vw, 6.6rem); line-height: .9; letter-spacing: -.03em; }
.fund3__body .label { color: var(--mist); }
.fund3__name { font-family: var(--serif); font-size: clamp(1.9rem, 3.1vw, 3.1rem); line-height: 1.02; letter-spacing: -.015em; margin-top: 12px; }
.fund3__asset { margin-top: 8px; color: var(--bone); }
.fund3__specs { display: flex; flex-wrap: wrap; gap: 16px clamp(20px, 2.6vw, 40px); margin-top: 22px; padding-top: 18px; border-top: 1px solid rgba(255, 255, 255, .34); align-items: flex-end; }
.fund3 .spec { display: grid; gap: 2px; }
.fund3 .spec__k { font-size: .75rem; color: var(--bone); letter-spacing: .04em; }
.fund3 .spec__v { font-size: .9375rem; color: #fff; }
.fund3__flags { display: flex; align-items: center; gap: 14px; margin-left: auto; }
.fund3 .status, .fund3 .status--open { color: #fff; }
.fund3 .status--open::before { background: var(--mist); border-color: var(--mist); }
.fund3 .sfdr { color: #fff; border-color: rgba(255, 255, 255, .6); }
.fund3--more { background: var(--deep); justify-content: center; gap: 28px; width: min(46vw, 700px); }
.fund3--more .eyebrow, .fund3--more .h2 em { color: var(--mist); }
.fund3--more .eyebrow::after { background: var(--mist); }
.fund3--more .link-arrow { align-self: flex-start; color: var(--bone); }
.strat3__bar { position: absolute; left: var(--gutter); right: var(--gutter); bottom: clamp(14px, 3vh, 30px); height: 2px; background: rgba(32, 59, 46, .16); }
.strat3__bar i { display: block; height: 100%; background: #437C90; transform: scaleX(0); transform-origin: left; }

/* ── Values: stacked cards ──────────────────────────────── */
.values3 { background: var(--bone); padding-block: clamp(64px, 8vw, 120px) clamp(80px, 10vw, 150px); }
.values3__head { max-width: 760px; }
.values3__head .lead { max-width: 44ch; }
.stack { list-style: none; display: grid; gap: 34vh; padding-bottom: 8vh; }
.stack__item { position: sticky; top: calc(var(--header-h) - 28px); }
.stack__item:nth-child(2) { top: calc(var(--header-h) - 8px); }
.stack__item:nth-child(3) { top: calc(var(--header-h) + 12px); }
.stack__card { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); min-height: min(76vh, 720px); border-radius: var(--radius); overflow: hidden; transform-origin: center top; will-change: transform; }
.stack__card--0 { background: var(--deep); color: var(--bone); }
.stack__card--1 { background: #437C90; color: #fff; }
.stack__card--2 { background: var(--mist); color: var(--deep); }
.stack__text { display: flex; flex-direction: column; justify-content: space-between; gap: 48px; padding: clamp(28px, 4vw, 64px); }
.stack__n { font-family: var(--serif); font-size: clamp(4rem, 9vw, 9rem); line-height: .85; letter-spacing: -.03em; opacity: .55; }
.stack__title { font-family: var(--serif); font-size: clamp(2.4rem, 4.8vw, 4.8rem); line-height: 1; letter-spacing: -.02em; margin-bottom: 20px; }
.stack__text p { font-size: var(--fs-lead); line-height: 1.5; max-width: 40ch; }
.stack__media { overflow: hidden; position: relative; min-height: 320px; }
.stack__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ── Team: window opening to full screen ────────────────── */
.zoom3 { height: 300vh; background: var(--bone); }
.zoom3__stage { position: sticky; top: 0; height: 100vh; height: 100lvh; overflow: hidden; color: #fff; display: flex; align-items: flex-end; }
.zoom3__frame { position: absolute; inset: 0; overflow: hidden; --shade: 0; will-change: clip-path; }
.zoom3__frame img { width: 100%; height: 100%; object-fit: cover; object-position: center 45%; }
.zoom3__frame::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(32, 59, 46, .94) 0%, rgba(32, 59, 46, .72) 34%, rgba(32, 59, 46, .08) 72%); opacity: calc(var(--shade) * 1.6); }
.zoom3__content { position: relative; width: 100%; padding-block: clamp(40px, 9vh, 96px); display: grid; gap: 24px; justify-items: start; }
.zoom3__content .h1 em { color: var(--mist); }
.zoom3__content .lead { color: #fff; max-width: 56ch; }
.btn--light { background: var(--bone); color: var(--ink); border-color: var(--bone); }
.btn--light:hover { background: #fff; color: var(--ink); }

/* ── Portfolio marquees ─────────────────────────────────── */
.folio3 { background: var(--bg); padding-block: clamp(80px, 10vw, 160px); overflow: clip; }
.folio3__head { display: grid; grid-template-columns: repeat(12, minmax(0, 1fr)); column-gap: var(--gap); row-gap: 24px; align-items: end; margin-bottom: var(--space-m); }
.folio3__head .h1 { grid-column: 1 / span 7; }
.folio3__head > div { grid-column: 9 / -1; display: grid; gap: 20px; justify-items: start; }
.marquee { overflow: clip; padding-block: clamp(6px, .8vw, 12px); }
.marquee__track { display: flex; width: max-content; list-style: none; will-change: transform; }
.marquee.is-static { overflow-x: auto; }
.tile3 { flex: none; padding-inline: clamp(6px, .8vw, 12px); }
.tile3 a { display: block; position: relative; width: clamp(260px, 30vw, 460px); aspect-ratio: 16 / 10; overflow: hidden; border-radius: clamp(14px, 1.6vw, 24px); color: #fff; background: var(--deep); }
.tile3 img { width: 100%; height: 100%; object-fit: cover; transition: scale 1s var(--ease); }
.tile3 a:hover img { scale: 1.08; }
.tile3 a::after { content: ""; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(32, 59, 46, .88), rgba(32, 59, 46, .05) 62%); }
.tile3__info { position: absolute; left: clamp(14px, 1.5vw, 24px); right: clamp(14px, 1.5vw, 24px); bottom: clamp(12px, 1.3vw, 20px); z-index: 1; display: grid; gap: 4px; }
.tile3__info .label { color: #fff; }
.tile3__info strong { font-family: var(--serif); font-weight: 400; font-size: clamp(1.5rem, 2.3vw, 2.25rem); line-height: 1.05; }

/* ── IBIST on the home ──────────────────────────────────── */
.impact3 { background: var(--bone); padding-bottom: var(--space-l); }
.marquee--certs { background: var(--sage); color: var(--deep); padding-block: 0; margin-bottom: var(--space-l); }
.marquee--certs li { font-family: var(--serif); font-size: clamp(1.5rem, 2.8vw, 2.75rem); line-height: 1; white-space: nowrap; padding: clamp(18px, 2.2vw, 32px) clamp(28px, 3.6vw, 56px); position: relative; }
.marquee--certs li::after { content: ""; position: absolute; right: 0; top: 50%; width: 7px; height: 7px; margin-top: -3px; border-radius: 50%; background: var(--deep); }
.impact3__grid { align-items: start; row-gap: 48px; }
.impact3__radar { grid-column: 1 / span 6; position: sticky; top: calc(var(--header-h) + 16px); }
.impact3__copy { grid-column: 7 / -1; display: grid; gap: var(--space-m); justify-items: start; }
.impact3__radar .ibist__radar { grid-column: auto; }
.dims3 { list-style: none; width: 100%; }
.dims3 li { padding-block: clamp(36px, 7vh, 72px); border-top: 1px solid var(--line-strong); transition: opacity .5s; }
.js .dims3 li { opacity: .42; }
.js .dims3 li.is-on { opacity: 1; }
.dims3 li > span { font-size: .8125rem; color: var(--teal-ink); font-variant-numeric: tabular-nums; }
.dims3 .h3 { margin: 10px 0 14px; }
.dims3 p { font-size: var(--fs-lead); line-height: 1.5; max-width: 44ch; color: var(--ink-2); }

/* ── News rows ──────────────────────────────────────────── */
.feed-item { position: relative; isolation: isolate; padding-inline: 0; transition: color .35s, padding .5s var(--ease); }
.feed-item::before { content: ""; position: absolute; inset: 0 calc(-1 * clamp(12px, 1.4vw, 24px)); z-index: -1; background: var(--deep); border-radius: 14px; transform: scaleY(0); transform-origin: bottom; transition: transform .5s var(--ease); }
.feed-item:hover, .feed-item:focus-visible { color: var(--bone); padding-left: clamp(8px, 1.4vw, 24px); }
.feed-item:hover::before, .feed-item:focus-visible::before { transform: scaleY(1); }
.feed-item:hover :is(.tag-line, .feed-item__cta), .feed-item:focus-visible :is(.tag-line, .feed-item__cta) { color: var(--mist); }
.news3 .feed-item .h4 { font-size: clamp(1.6rem, 2.6vw, 2.6rem); }

/* ── Footer curtain ─────────────────────────────────────── */
main { border-radius: 0 0 var(--radius) var(--radius); overflow: clip; }
.site-footer { position: sticky; bottom: 0; z-index: 1; margin-top: calc(-1 * var(--radius)); padding-top: calc(var(--radius) + clamp(16px, 3vw, 48px)); }
.footer__tagline { grid-column: 1 / -1 !important; font-size: clamp(3rem, 7.4vw, 8rem) !important; line-height: .96 !important; }

/* ── Inner pages ────────────────────────────────────────── */
.page-hero--photo { min-height: 100vh; min-height: 100lvh; }
.page-hero__title { font-size: clamp(3.2rem, 8vw, 9rem); }
.page-hero__bg img { will-change: transform; }

/* Cards and rows respond to the pointer */
.company__media { overflow: hidden; border-radius: clamp(10px, 1vw, 16px); }
.company__media > img { transition: scale .9s var(--ease); }
.company:hover .company__media > img { scale: 1.06; }
.person__photo { overflow: hidden; border-radius: clamp(10px, 1vw, 16px); }
.person__photo img { filter: grayscale(.85); transition: filter .6s, scale .9s var(--ease); }
.person:hover .person__photo img, .person:focus-within .person__photo img { filter: none; scale: 1.05; }
.strat-row { position: relative; transition: padding .5s var(--ease), background-color .4s; }
a.strat-row:hover { background: var(--hover); padding-inline: 16px; }
.objective > img { border-radius: 12px; }
.btn, .investor { border-radius: 999px; }
.btn { padding-inline: 30px; }
.filter[aria-pressed="true"] { border-bottom-width: 3px; }

/* Profile dialog slides in from the side */
.person-dialog[open] { animation: dlg-in .55s var(--ease) both; }
.person-dialog::backdrop { background: rgba(32, 59, 46, .6); -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); }
@keyframes dlg-in { from { opacity: 0; transform: translateY(40px) scale(.98); } }

.fund__nav { position: sticky; }
.fund__line { display: block; position: absolute; left: -14px; top: 0; bottom: 0; width: 2px; background: var(--teal); transform: scaleY(0); transform-origin: top; }

/* ── Tablet & phone ─────────────────────────────────────── */
@media (max-width: 1080px) {
  .hero3 { height: 190vh; }
  .hero3__cue { display: none; }
  .hero3__title .keep { white-space: normal; }
  .strat3__track { padding-inline: var(--gutter) 8vw; }
  .strat3__intro { width: 84vw; padding-right: 0; }
  .fund3 { width: 84vw; height: min(78svh, 620px); }
  .fund3--more { width: 84vw; }
  .fund3__flags { margin-left: 0; }
  .stack__item, .stack__item:nth-child(2), .stack__item:nth-child(3) { top: calc(var(--header-h) + 8px); }
  .stack__card { grid-template-columns: 1fr; min-height: 0; }
  .stack__media { min-height: 0; aspect-ratio: 16 / 10; order: -1; }
  .stack__text { gap: 24px; }
  .stack__n { display: none; }
  .stack { gap: 14vh; }
  .zoom3 { height: 220vh; }
  .folio3__head .h1, .folio3__head > div { grid-column: 1 / -1; }
  .impact3__radar, .impact3__copy { grid-column: 1 / -1; }
  .impact3__radar { position: static; }
  .site-footer { position: static; }
  main { border-radius: 0; }
  .fund__line { display: none; }
}
@media (max-width: 700px) {
  .manifest3__text { font-size: clamp(1.9rem, 8vw, 3rem); }
  .fund3__size { font-size: clamp(2.8rem, 15vw, 4rem); }
  .fund3 .spec__v { font-size: .875rem; }
  .fund3__specs { gap: 10px 18px; margin-top: 16px; padding-top: 14px; }
  .tile3 a { width: 72vw; }
  .page-hero--photo { min-height: 86svh; }
}

/* Very short screens (phones in landscape): keep only what fits. */
@media (max-height: 520px) {
  .strat3__intro { gap: 12px; }
  .strat3__intro .lead, .fund3__asset, .fund3 .spec { display: none; }
  .strat3__intro .h1 { font-size: clamp(2rem, 11vh, 3rem); }
  .fund3 { height: 84svh; padding: 16px 20px; }
  .fund3__size { font-size: clamp(2rem, 15vh, 3.4rem); }
  .fund3__name { font-size: clamp(1.4rem, 8vh, 2rem); margin-top: 4px; }
  .fund3__specs { margin-top: 8px; padding-top: 8px; }
  .fund3--more { gap: 12px; }
  .fund3--more .h2 { font-size: clamp(1.5rem, 9vh, 2.2rem); }
}

/* ── Reduced motion: same content, nothing sticky or travelling ─────────── */
@media (prefers-reduced-motion: reduce) {
  .hero3, .zoom3 { height: auto; }
  .hero3__stage, .zoom3__stage { position: relative; height: 100svh; }
  .zoom3__frame::after { opacity: .85; }
  .strat3__stage { position: static; height: auto; display: block; overflow-x: auto; padding-block: 72px; }
  .strat3__track { width: max-content; }
  .stack__item, .stack__item:nth-child(2), .stack__item:nth-child(3), .impact3__radar, .site-footer { position: static; }
  .dims3 li, .js .dims3 li { opacity: 1; }
  .hero3__cue { display: none; }
  .intro3 { display: none !important; }
}