/* Self-hosted families used in Figma 46:683 and hover state 46:1066.
   Commercial webfonts are the unmodified files supplied by the license owner. */
@font-face {
  font-family: "Romie";
  src: url("assets/fonts/Romie-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "PP Frama";
  src: url("assets/fonts/PPFrama-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "PP Frama Text";
  src: url("assets/fonts/PPFramaText-Regular.woff2") format("woff2");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Jost";
  src: url("assets/fonts/jost-variable.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Montserrat";
  src: url("assets/fonts/montserrat-variable.ttf") format("truetype");
  font-weight: 100 900;
  font-style: normal;
  font-display: swap;
}
@font-face {
  font-family: "Instrument Serif";
  src: url("assets/fonts/instrument-serif-italic.ttf") format("truetype");
  font-weight: 400;
  font-style: italic;
  font-display: swap;
}

:root {
  color-scheme: light;
  --cream: #fdfaef;
  --burgundy: #590e13;
  --orange: #ff4511;
  --ink: #25242f;
  --muted: #7b7a7c;
  --sans: "PP Frama Text", "Avenir Next", Avenir, Arial, sans-serif;
  --serif: "Romie", "Baskerville", "Times New Roman", serif;
  --label-sans: "PP Frama", "PP Frama Text", "Avenir Next", Avenir, Arial, sans-serif;
  --nav-sans: "Jost", "Avenir Next", Avenir, Arial, sans-serif;
  --overlay-sans: "Montserrat", Arial, sans-serif;
  --company-serif: "Instrument Serif", "Baskerville", "Times New Roman", serif;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 36px; }
body { margin: 0; background: var(--cream); color: var(--ink); font-family: var(--sans); font-weight: 400; font-style: normal; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
img { display: block; max-width: 100%; height: auto; }
h1, h2, h3, p { margin: 0; }
::selection { background: var(--burgundy); color: var(--cream); }
:focus-visible { outline: 2px solid var(--burgundy); outline-offset: 6px; }
.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; }
.skip-link { position: fixed; z-index: 10; top: 12px; left: 12px; padding: 12px 18px; background: var(--burgundy); color: var(--cream); transform: translateY(-160%); }
.skip-link:focus { transform: none; }
.page { position: relative; max-width: 1360px; margin-inline: auto; overflow: clip; }
.site-header { height: min(6.62vw, 90px); padding: 0 4.71%; display: flex; align-items: center; justify-content: space-between; position: absolute; top: 0; width: 100%; z-index: 2; pointer-events: none; }
.site-header a, .site-header nav { pointer-events: auto; }
.brand { width: 12.1%; min-width: 140px; display: block; }
.brand-artwork { position: relative; display: block; }
.brand-artwork::after { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0; background: linear-gradient(110deg, transparent 38%, rgb(253 250 239 / .75) 50%, transparent 62%); background-size: 250% 100%; background-position: 100% 0; -webkit-mask: url("assets/stardust.svg") center / contain no-repeat; mask: url("assets/stardust.svg") center / contain no-repeat; }
.brand:focus-visible .brand-artwork::after { animation: brand-glint 950ms ease-out; }
@media (hover: hover) and (pointer: fine) {
  .brand:hover .brand-artwork::after { animation: brand-glint 950ms ease-out; }
}
@keyframes brand-glint {
  0% { background-position: 100% 0; opacity: 0; }
  15%, 75% { opacity: 1; }
  100% { background-position: 0% 0; opacity: 0; }
}
.main-nav { display: flex; gap: clamp(24px, 3.4vw, 46px); }
.main-nav a { font-family: var(--nav-sans); font-size: 11px; font-weight: 500; line-height: 16.5px; letter-spacing: .18em; text-transform: uppercase; padding: 12px 0; transition: color 180ms; }
.main-nav a:hover { color: var(--burgundy); text-decoration: underline; text-underline-offset: 6px; }
.hero { position: relative; isolation: isolate; height: clamp(600px, 63.870493vw, 868.639px); margin: 0 0 24px; overflow: hidden; color: var(--burgundy); }
.hero-copy { position: absolute; z-index: 2; inset: 0; pointer-events: none; }
.hero-caption { position: absolute; top: 78.225806%; width: 100%; text-align: center; text-transform: uppercase; font-family: var(--label-sans); font-size: clamp(12px, 1.383959vw, 18.808px); font-weight: 400; line-height: normal; letter-spacing: .1em; pointer-events: none; }
/* The headline stays still while the investor field moves through depth. */
.hero h1 { position: absolute; top: 35.591382%; left: 50%; transform: translateX(-50%); width: 55.85183%; line-height: 1; text-align: center; }
.hero-lettering { width: 100%; }
.investor-portraits { position: absolute; inset: 0; overflow: clip; touch-action: pan-y; }
.investor-space { position: relative; width: 100%; height: 100%; perspective: 1100px; perspective-origin: 50% 48%; }
.investor-portrait { --overlay-background: var(--orange); --overlay-foreground: var(--burgundy); position: absolute; left: var(--x); top: var(--y); width: var(--w); z-index: 1; transform-origin: center; will-change: transform; container-type: inline-size; -webkit-tap-highlight-color: transparent; }
.investor-portrait[data-overlay-color="1"] { --overlay-background: var(--burgundy); --overlay-foreground: var(--orange); }
.investor-photo { position: relative; display: block; overflow: hidden; aspect-ratio: var(--ratio, .82); background: #d9d3c8; border-radius: 0; }
.investor-photo-next { position: absolute; inset: 0; pointer-events: none; animation: investor-crossfade var(--portrait-crossfade-duration, 600ms) ease-in-out both; }
@keyframes investor-crossfade { from { opacity: 0; } to { opacity: 1; } }
/* Frame the original photograph without retouching its subject. Each crop and
   natural-color grade travels with its person, including during a crossfade. */
.investor-photo img { position: absolute; width: calc(var(--photo-width) / var(--ratio, .82) * 100%); height: calc(var(--photo-height) * 100%); max-width: none; left: clamp(calc(100% - var(--photo-width) / var(--ratio, .82) * 100%), calc(50% - var(--photo-center-x) / var(--ratio, .82) * 100%), 0%); top: calc(var(--photo-top) * -100%); filter: var(--photo-tone); -webkit-user-drag: none; user-select: none; }
/* Figma hover frames 46:1066 and 46:1053: orange/burgundy, star above, identity below. */
.investor-overlay { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: space-between; gap: 8px; padding: clamp(6px, 11cqw, 17px); background: var(--overlay-background); color: var(--overlay-foreground); opacity: 0; visibility: hidden; transition: opacity 160ms ease, visibility 160ms; pointer-events: none; }
.investor-mark { display: block; flex-shrink: 0; }
.investor-mark img { max-width: 100%; }
.investor-mark-orange { display: none; }
.investor-portrait[data-overlay-color="1"] .investor-mark-dark { display: none; }
.investor-portrait[data-overlay-color="1"] .investor-mark-orange { display: block; }
.investor-details { display: flex; flex-direction: column; gap: 10px; }
.investor-name { font-family: var(--overlay-sans); font-size: var(--investor-name-size, 12px); font-weight: 800; line-height: 1.2; letter-spacing: .1em; text-transform: uppercase; white-space: pre; overflow-wrap: normal; word-break: normal; hyphens: none; }
.investor-link-label { font-family: var(--overlay-sans); font-weight: 500; display: flex; align-items: center; justify-content: space-between; gap: 2px; font-size: clamp(8px, 8cqw, 11px); line-height: 1.2; }
@container (max-width: 100px) {
  .investor-overlay { padding: 7px; gap: 4px; }
  .investor-mark { height: 16px; }
  .investor-mark img { transform: scale(.7); transform-origin: top left; }
  .investor-details { gap: 5px; }
}
@container (max-width: 80px) {
  .investor-overlay { padding: 4px; gap: 2px; }
  .investor-mark { height: 10px; }
  .investor-mark img { transform: scale(.45); }
  .investor-details { gap: 2px; }
}
.investor-portrait:is(:focus-visible, .is-revealed) { z-index: 4; }
.investor-portrait:is(:focus-visible, .is-revealed) .investor-overlay { opacity: 1; visibility: visible; }
@media (hover: hover) and (pointer: fine) {
  .investor-portrait:hover { z-index: 4; }
  .investor-portrait:hover .investor-overlay { opacity: 1; visibility: visible; }
}
/* Seven slots from Figma 46:683, normalized to its 1359 × 868 hero. */
.investor-portrait:nth-child(1) { --x: 15.30537160%; --y: 11.75115207%; --w: 10.12466913%; --depth: 1; --ratio: 0.814720205; }
.investor-portrait:nth-child(2) { --x: 68.80058867%; --y: 8.87096774%; --w: 10.00735723%; --depth: 0.85; --ratio: 0.795417225; }
.investor-portrait:nth-child(3) { --x: -0.17921611%; --y: 38.52702198%; --w: 11.55013308%; --depth: 0.65; --ratio: 0.762066865; }
.investor-portrait:nth-child(4) { --x: 88.37380427%; --y: 24.19354839%; --w: 9.30566121%; --depth: 0.35; --ratio: 0.799723771; }
.investor-portrait:nth-child(5) { --x: 81.11670173%; --y: 54.06700521%; --w: 8.53410093%; --depth: 0.25; --ratio: 0.800285305; }
.investor-portrait:nth-child(6) { --x: 12.02774329%; --y: 71.62523401%; --w: 10.68962159%; --depth: 0.8; --ratio: 0.800285245; }
.investor-portrait:nth-child(7) { --x: 89.10963944%; --y: 74.88479263%; --w: 11.23014538%; --depth: 0.95; --ratio: 0.791892540; }
.partners { width: 100%; margin: 96px auto 54px; padding: 0 0 32px; border-bottom: 1px solid rgb(89 14 19 / .18); }
.eyebrow { font-family: var(--label-sans); font-size: clamp(11px, 1.145401vw, 15.566px); font-weight: 400; line-height: normal; text-transform: uppercase; letter-spacing: .1em; }
.partners .eyebrow { display: flex; align-items: center; justify-content: center; gap: 24px; margin-bottom: 32px; color: var(--burgundy); white-space: nowrap; text-align: center; }
.partners .eyebrow::before, .partners .eyebrow::after { content: ""; flex: 1; border-top: 1px solid rgb(89 14 19 / .18); }
.partner-marquee { --logo-gap: clamp(28px, 3vw, 40px); --logo-height: 32px; min-width: 0; overflow: hidden; -webkit-mask-image: linear-gradient(to right, transparent, #000 24px, #000 calc(100% - 24px), transparent); mask-image: linear-gradient(to right, transparent, #000 24px, #000 calc(100% - 24px), transparent); }
.partner-track { display: flex; width: max-content; animation: partner-scroll 40s linear infinite; will-change: transform; }
.partner-group { display: flex; flex: 0 0 auto; align-items: center; gap: 24px var(--logo-gap); padding-inline: calc(var(--logo-gap) / 2); }
.partner-group a { position: relative; display: flex; flex: 0 0 auto; align-items: center; min-height: 44px; }
.partner-group .partner-logo-color { position: absolute; left: 0; top: 50%; transform: translateY(-50%); opacity: 0; pointer-events: none; transition: opacity 180ms ease; }
.partner-group a:is(:focus-visible, :active) .partner-logo-color { opacity: 1; }
@media (hover: hover) and (pointer: fine) {
  .partner-group a:hover .partner-logo-color { opacity: 1; }
}
@media (prefers-reduced-motion: reduce) {
  .partner-group .partner-logo-color { transition: none; }
}
.partner-group a:focus-visible { outline-offset: -1px; }
/* Only keyboard navigation exposes the stationary set. Mouse/touch focus from
   opening a link must not resize the marquee or move the sections below it. */
.partner-marquee:has(a:focus-visible) { -webkit-mask-image: none; mask-image: none; }
.partner-marquee:has(a:focus-visible) .partner-track { width: 100%; animation: none; transform: none; }
.partner-marquee:has(a:focus-visible) .partner-group { width: 100%; flex-wrap: wrap; }
.partner-marquee:has(a:focus-visible) .partner-group[aria-hidden="true"] { display: none; }
.partner-group img { flex: 0 0 auto; width: auto; max-width: none; height: var(--logo-height); }
@keyframes partner-scroll { to { transform: translateX(-50%); } }
@media (hover: hover) {
  .partner-marquee:hover .partner-track { animation-play-state: paused; }
}
.firm { width: 77.2%; margin: min(5.5vw, 80px) auto 0; display: grid; grid-template-columns: 31.4% 1fr; column-gap: 6.7%; row-gap: 64px; }
.firm h2 { color: var(--burgundy); font-family: var(--serif); font-size: clamp(36px, 3.661516vw, 49.76px); font-weight: 400; font-style: normal; line-height: 1.270096463; letter-spacing: 0; }
.firm-copy { padding-top: 10px; max-width: 590px; }
.firm-copy p { font-family: var(--sans); font-weight: 400; font-style: normal; font-size: 16px; line-height: 24.8px; letter-spacing: 0; }
.firm-copy p + p { margin-top: 23px; }
/* Original two-by-two portfolio layout, with the current brand typography. */
.companies { width: 86%; max-width: 1080px; margin: 0 auto; padding-top: 34px; }
.companies > .eyebrow { text-align: center; margin-bottom: 29px; }
.company-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: min(1.47vw, 24px); }
.company { position: relative; isolation: isolate; container-type: inline-size; aspect-ratio: 574.375 / 717.97; overflow: hidden; border-radius: 4px; background: #50483d; }
.company::after { content: ""; position: absolute; inset: 0; background: linear-gradient(180deg, rgb(89 14 19 / .04) 20%, rgb(35 13 15 / .25) 55%, rgb(27 9 11 / .72) 100%); z-index: 1; pointer-events: none; }
.company::before { content: ""; position: absolute; z-index: 2; inset: 0; background: linear-gradient(180deg, rgb(89 14 19 / .14), rgb(89 14 19 / .92)); opacity: 0; transition: opacity 300ms ease; pointer-events: none; }
.company-photo { width: 100%; height: 100%; object-fit: cover; object-position: center; transition: transform 550ms ease; }
.company-mirendil .company-photo { object-position: 44% center; }
.company-engram .company-photo { object-position: center 35%; scale: 1.2; transform-origin: 50% 30%; filter: saturate(.55) sepia(.08); }
.company-caption { position: absolute; z-index: 5; left: 6.8%; right: 6.8%; bottom: 6%; color: var(--cream); pointer-events: none; }
.company-founder { font-family: var(--nav-sans); font-size: clamp(9px, 2.416cqw, 12px); font-weight: 400; line-height: 1.6; letter-spacing: .18em; text-transform: uppercase; margin-bottom: 8px; }
.company-caption h3 { font-family: var(--company-serif); font-weight: 400; font-size: clamp(32px, 12.563667cqw, 67px); line-height: 1.2; font-style: italic; letter-spacing: 0; }
.company-details { display: grid; grid-template-rows: 0fr; opacity: 0; visibility: hidden; transition: grid-template-rows 300ms ease, opacity 250ms ease, visibility 300ms; }
.company-details > div { min-height: 0; overflow: hidden; }
.company-description { max-width: 32ch; margin-top: 24px; padding-top: 20px; border-top: 1px solid rgb(253 250 239 / .35); font-size: clamp(14px, 3.4cqw, 18px); line-height: 1.5; font-weight: 400; letter-spacing: 0; text-transform: none; }
.company-website { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; margin-top: 12px; padding-inline: 4px; font-size: 14px; line-height: 1.5; text-decoration: underline; text-underline-offset: 4px; }
.company-link { position: absolute; z-index: 4; inset: 0; border-radius: inherit; color: var(--cream); -webkit-tap-highlight-color: transparent; }
.company-link:focus-visible { outline: 2px solid var(--cream); outline-offset: -8px; }
.company-link-icon { position: absolute; top: 5%; right: 6.8%; width: 44px; height: 44px; display: grid; place-items: center; transition: transform 300ms ease; }
.company-link-icon img { width: 31px; height: 29px; max-width: none; }
.company:is(.is-revealed, :has(.company-link:focus-visible))::before { opacity: 1; }
.company:is(.is-revealed, :has(.company-link:focus-visible)) .company-details { grid-template-rows: 1fr; opacity: 1; visibility: visible; }
.company:is(.is-revealed, :has(.company-link:focus-visible)) .company-photo { transform: scale(1.025); }
.company:is(.is-revealed, :has(.company-link:focus-visible)) .company-link-icon { transform: rotate(45deg); }
@media (hover: hover) and (pointer: fine) {
  .company:hover::before { opacity: 1; }
  .company:hover .company-details { grid-template-rows: 1fr; opacity: 1; visibility: visible; }
  .company:hover .company-photo { transform: scale(1.025); }
  .company:hover .company-link-icon { transform: rotate(45deg); }
}
.closing { width: 70%; margin: min(7.5vw, 100px) auto min(6.2vw, 80px); }
.closing img { width: 100%; }
.site-footer { width: 85.5%; margin: 0 auto; border-top: 1px solid #7b7a7c; display: flex; align-items: center; justify-content: space-between; gap: 24px; padding: 24px 0 32px; color: #656367; }
.footer-locations { display: flex; flex-wrap: wrap; gap: 30px; font-family: var(--label-sans); font-weight: 400; font-size: 10px; letter-spacing: .18em; text-transform: uppercase; line-height: 15px; }
.footer-star { flex-shrink: 0; width: 52px; min-height: 52px; padding: 4px; display: grid; place-items: center; }
.footer-star img { filter: grayscale(1); opacity: .55; transition: opacity 180ms, transform 180ms; }
.footer-star:hover img { opacity: 1; transform: translateY(-3px); }

/* On wide screens, let the starfield travel beyond the content column.
   Clip only at the viewport's sides and the hero's vertical boundaries. */
@media (min-width: 1361px) {
  body { overflow-x: clip; }
  .page { overflow: visible; }
  .hero, .investor-portraits { overflow-x: visible; overflow-y: clip; }
}

@media (max-width: 1000px) {
  .site-header { height: 84px; }
  .brand { min-width: 130px; }
  .main-nav { gap: 22px; }
  .main-nav a { font-size: 11px; }
  .hero-caption { font-size: 12px; }
  .firm { width: 82%; column-gap: 7%; grid-template-columns: 31% 1fr; }
  .firm-copy { padding-top: 0; }
  .footer-locations { gap: 24px; }
}

@media (max-width: 900px) {
  .site-header { position: relative; }
  .hero { height: 580px; margin-top: 12px; }
  .hero h1 { top: 37%; width: 56%; max-width: 440px; }
  .hero-caption { top: 72%; }
  .hero-caption { font-size: 11px; }
  .investor-space { perspective: 1400px; }
  .investor-portrait:focus-visible { outline-offset: 3px; }
  .investor-portrait:nth-child(3) { --x: 2%; }
  .investor-portrait:nth-child(4) { --x: 86%; }
  .investor-portrait:nth-child(5) { --x: 80%; }
  .investor-portrait:nth-child(7) { --x: 86%; }
}

@media (max-width: 640px) {
  html { scroll-padding-top: 24px; }
  .site-header { height: 112px; padding: 24px 6% 16px; flex-direction: column; align-items: flex-start; gap: 20px; }
  .brand { width: 137px; min-width: 0; }
  .main-nav { width: 100%; justify-content: flex-end; gap: 22px; }
  .main-nav a { font-size: 11px; padding: 6px 0; }

  .hero { height: clamp(500px, 146vw, 780px); }
  .hero h1 { top: 44%; width: 86%; max-width: 440px; }
  .hero-caption { top: 68%; }
  .hero-caption { font-size: 10px; }
  /* A complete, staggered ring fits on the phone without horizontal panning. */
  .investor-portrait:nth-child(1) { --x: 15%; --y: 3%; --w: min(24%, 110px); }
  .investor-portrait:nth-child(2) { --x: 62%; --y: 0%; --w: min(23%, 108px); }
  .investor-portrait:nth-child(3) { --x: 3%; --y: 25%; --w: min(20%, 96px); }
  .investor-portrait:nth-child(4) { --x: 76%; --y: 23%; --w: min(20%, 96px); }
  .investor-portrait:nth-child(5) { --x: 7%; --y: 72%; --w: min(22%, 104px); }
  .investor-portrait:nth-child(6) { --x: 40%; --y: 78%; --w: min(22%, 104px); }
  .investor-portrait:nth-child(7) { --x: 74%; --y: 71%; --w: min(22%, 104px); }
  .partners { margin: 56px auto 32px; padding-bottom: 28px; }
  .partners .eyebrow { gap: 16px; margin-bottom: 24px; }
  .partner-marquee { --logo-gap: 32px; --logo-height: 28px; }
  .partner-track { animation-duration: 32s; }
  .firm { width: 86%; display: block; margin-top: 35px; }
  .firm h2 { width: 68%; max-width: 280px; margin-bottom: 25px; }
  .firm-content + h2 { margin-top: 40px; }
  .firm-copy { max-width: none; }
  .firm-copy p + p { margin-top: 20px; }
  .companies { width: 88%; }
  .company-grid { grid-template-columns: 1fr; gap: 18px; }
  .company { border-radius: 3px; }
  .company-caption { left: 7%; right: 7%; bottom: 7%; }
  .company-founder { font-size: 10px; }
  .company-description { font-size: 16px; margin-top: 20px; padding-top: 16px; }
  .closing { width: 90%; margin: 58px auto 46px; }
  .site-footer { width: 86%; gap: 16px; padding: 18px 0 24px; }
  .footer-locations { gap: 16px; }
  .footer-star { width: 44px; min-height: 44px; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { transition: none !important; }
  .brand-artwork::after { animation: none !important; opacity: 0 !important; }
  .investor-portrait { transform: none !important; will-change: auto; }
  .partner-marquee { -webkit-mask-image: none; mask-image: none; }
  .partner-track { width: 100%; animation: none; transform: none; will-change: auto; }
  .partner-group { width: 100%; min-width: 0; flex-wrap: wrap; justify-content: center; }
  .partner-group[aria-hidden="true"] { display: none; }
}