:root {
  --ink: #0c1f2a;
  --ink-soft: #15313e;
  --paper: #fbf8f1;
  --sand: #eee5d4;
  --copper: #c76b3b;
  --copper-dark: #9d4d29;
  --moss: #64766a;
  --rule: rgba(12, 31, 42, 0.16);
  --serif: Georgia, 'Times New Roman', serif;
  --sans: Inter, Avenir, 'Segoe UI', Helvetica, Arial, sans-serif;
  --max: 1280px;
  --ease: cubic-bezier(.2,.75,.25,1);
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; background: var(--paper); color: var(--ink); font-family: var(--sans); font-size: 16px; line-height: 1.55; }
a { color: inherit; text-decoration-thickness: 1px; text-underline-offset: 4px; }
a:hover { color: var(--copper); }
button { font: inherit; }
::selection { background: var(--copper); color: #fff; }
.skip-link { background: var(--copper); color: #fff; left: 1rem; padding: .75rem 1rem; position: absolute; top: -5rem; z-index: 100; }
.skip-link:focus { top: 1rem; }
.sr-only { height: 1px; overflow: hidden; position: absolute; width: 1px; clip: rect(1px, 1px, 1px, 1px); }
.site-header { align-items: center; background: rgba(251,248,241,.93); border-bottom: 1px solid var(--rule); display: flex; gap: 2rem; justify-content: space-between; min-height: 82px; padding: 0 clamp(1.25rem,4vw,4rem); position: sticky; top: 0; z-index: 30; backdrop-filter: blur(14px); }
.brand { align-items: center; display: inline-flex; gap: .75rem; text-decoration: none; }
.brand-mark { background: var(--ink); color: var(--paper); display: grid; font-family: var(--serif); font-size: 1rem; font-weight: 700; grid-template-columns: 1fr 1fr; height: 34px; letter-spacing: -.12em; line-height: 1; overflow: hidden; position: relative; width: 34px; }
.brand-mark::after { background: var(--copper); content: ''; height: 100%; position: absolute; transform: rotate(34deg); width: 4px; left: 15px; }
.brand-mark span { align-items: center; display: flex; justify-content: center; position: relative; z-index: 1; }
.brand-wordmark { display: flex; flex-direction: column; line-height: 1.1; }
.brand-wordmark strong { font-family: var(--serif); font-size: 1rem; font-weight: 700; letter-spacing: -.02em; }
.brand-wordmark small { color: #5e686a; font-size: .64rem; letter-spacing: .08em; margin-top: .2rem; text-transform: uppercase; }
.site-nav { align-items: center; display: flex; gap: clamp(.9rem,2vw,2rem); }
.site-nav a { color: #33454c; font-size: .78rem; font-weight: 650; letter-spacing: .02em; text-decoration: none; }
.site-nav a:hover { color: var(--copper); }
.site-nav .nav-cta { border-bottom: 1px solid var(--copper); color: var(--ink); padding: .45rem 0; }
.nav-toggle { background: transparent; border: 0; color: var(--ink); cursor: pointer; display: none; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.section { padding: clamp(4.5rem,9vw,9rem) clamp(1.25rem, 6vw, 6rem); }
.section-dark, .section-ink { color: var(--paper); }
.section-sand { background: var(--sand); }
.section-paper { background: var(--paper); }
.section-ink { background: var(--ink); }
.section-label { align-items: center; color: #556067; display: flex; font-size: .7rem; font-weight: 700; gap: .6rem; letter-spacing: .1em; margin-bottom: 2.5rem; text-transform: uppercase; }
.section-label span { color: var(--copper); font-family: var(--serif); font-size: 1.1rem; font-weight: 700; letter-spacing: 0; }
.section-label.light { color: #b6c1bd; }.section-label.light span { color: #ec9d73; }.section-label.dark { color: rgba(12,31,42,.62); }.section-label.dark span { color: var(--ink); }
.eyebrow { align-items: center; display: flex; font-size: .72rem; font-weight: 700; gap: .75rem; letter-spacing: .12em; margin: 0 0 1.4rem; text-transform: uppercase; }
.eyebrow span { background: currentColor; display: inline-block; height: 1px; width: 2.5rem; }.eyebrow.copper { color: var(--copper-dark); }.eyebrow.dark { color: var(--ink); }
h1,h2,h3,p { margin-top: 0; }h1,h2,h3 { line-height: .98; }h1,h2 { font-family: var(--serif); font-weight: 500; letter-spacing: -.06em; }h1 { font-size: clamp(3.7rem, 8vw, 8rem); margin-bottom: 1.75rem; }h2 { font-size: clamp(2.7rem, 5.5vw, 5.5rem); margin-bottom: 0; }h1 em,h2 em { color: var(--copper); font-weight: 400; } .section-ink h2 em { color: #ec9d73; }.section-copper h2 em { color: var(--paper); }
.hero { background: var(--ink); isolation: isolate; min-height: calc(100svh - 82px); overflow: hidden; padding: clamp(4.8rem, 10vw, 9rem) clamp(1.25rem, 6vw, 6rem) 5rem; position: relative; }
.hero-image { background-image: linear-gradient(90deg, rgba(8,21,28,.94) 0%, rgba(8,21,28,.76) 38%, rgba(8,21,28,.16) 80%), url('/manus-storage/async-images/LfcxGS8NHR5ovVLFJrM93k/image-1.webp'); background-position: center; background-size: cover; inset: 0; opacity: .85; position: absolute; z-index: -2; }
.hero-grid, .contact-grid { background-image: linear-gradient(rgba(238,229,212,.07) 1px, transparent 1px), linear-gradient(90deg, rgba(238,229,212,.07) 1px, transparent 1px); background-size: 58px 58px; inset: 0; mask-image: linear-gradient(90deg, #000, transparent 80%); opacity: .54; pointer-events: none; position: absolute; z-index: -1; }
.hero-content { max-width: 765px; padding-top: clamp(1rem, 7vh, 8rem); position: relative; }.hero-copy { color: #e1e0da; font-size: clamp(1.02rem,1.6vw,1.3rem); line-height: 1.65; max-width: 615px; }.hero-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 2.15rem; }.button { align-items: center; display: inline-flex; font-size: .74rem; font-weight: 800; gap: 1rem; letter-spacing: .08em; padding: 1rem 1.25rem; text-decoration: none; text-transform: uppercase; transition: transform .25s var(--ease), background .25s var(--ease); }.button:hover { color: inherit; transform: translateY(-3px); }.button-copper { background: #df8050; color: var(--ink); }.button-copper:hover { background: #f1a06b; }.text-link { display: inline-flex; font-size: .76rem; font-weight: 750; gap: .55rem; letter-spacing: .06em; text-decoration: none; text-transform: uppercase; }.text-link.light { color: #fff; }.text-link.light:hover { color: #efaa85; }
.hero-proof { border-left: 1px solid rgba(238,229,212,.38); bottom: clamp(4rem,8vw,6rem); display: flex; flex-direction: column; gap: 1.25rem; padding-left: 1.35rem; position: absolute; right: clamp(1.25rem, 6vw, 6rem); width: 180px; }.proof-label { color: #b9c3bf; font-size: .66rem; font-weight: 700; letter-spacing: .1em; margin-bottom: .3rem; text-transform: uppercase; }.proof-stat { align-items: baseline; display: flex; gap: .55rem; }.proof-stat strong { color: #efaa85; font-family: var(--serif); font-size: 1.85rem; line-height: 1; }.proof-stat span { color: #dde2dd; font-size: .69rem; line-height: 1.25; }.scroll-cue { align-items: center; bottom: 1.8rem; color: #c8d1cc; display: flex; font-size: .63rem; font-weight: 700; gap: .7rem; left: clamp(1.25rem, 6vw, 6rem); letter-spacing: .1em; position: absolute; text-decoration: none; text-transform: uppercase; }.scroll-cue i { background: var(--copper); display: inline-block; height: 1px; position: relative; width: 46px; }.scroll-cue i::after { border-bottom: 1px solid var(--copper); border-right: 1px solid var(--copper); content: ''; height: 5px; position: absolute; right: 0; top: -3px; transform: rotate(-45deg); width: 5px; }
.intro-band { background: var(--copper); color: var(--ink); padding: clamp(3rem,6vw,5.5rem) clamp(1.25rem, 20vw, 19rem); }.intro-band p { font-family: var(--serif); font-size: clamp(1.6rem,3.2vw,3.2rem); letter-spacing: -.045em; line-height: 1.14; margin: 0; }.intro-band strong { color: #fff9ec; font-weight: 500; }
.about-layout { display: grid; gap: 4rem; grid-template-columns: minmax(0,1.12fr) minmax(290px,.88fr); max-width: var(--max); margin: 0 auto; }.about-heading h2 { max-width: 700px; }.about-copy { padding-top: .5rem; }.about-copy > p { color: #38454a; font-size: 1.04rem; line-height: 1.7; }.credentials { border-top: 1px solid var(--rule); margin: 2.2rem 0 0; }.credentials div { border-bottom: 1px solid var(--rule); display: grid; gap: 1rem; grid-template-columns: 105px 1fr; padding: .9rem 0; }.credentials dt { color: var(--copper-dark); font-size: .68rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.credentials dd { color: #34444b; font-size: .84rem; margin: 0; }
.portrait-frame { margin: clamp(2.5rem, 5vw, 4.5rem) 0 0; max-width: 360px; position: relative; }.portrait-frame::before { border: 1px solid var(--copper); content: ''; height: calc(100% - 2.3rem); left: 1rem; position: absolute; top: 1rem; width: calc(100% - 1rem); z-index: 0; }.portrait-image { aspect-ratio: 4 / 5; background: #d7d1c4; overflow: hidden; position: relative; z-index: 1; }.portrait-image img { display: block; height: 100%; object-fit: cover; object-position: center top; width: 100%; }.portrait-frame figcaption { align-items: baseline; background: var(--ink); color: var(--paper); display: flex; flex-wrap: wrap; gap: .45rem .75rem; margin: -1px 0 0 auto; max-width: 85%; padding: .75rem .9rem; position: relative; width: max-content; z-index: 2; }.portrait-frame figcaption span { color: #d9d8d0; font-size: .58rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }.portrait-frame figcaption strong { color: #efaa85; font-family: var(--serif); font-size: .9rem; font-weight: 500; letter-spacing: -.02em; }
.expertise { padding: clamp(4.5rem,9vw,9rem) clamp(1.25rem, 6vw, 6rem); }.expertise-header { align-items: end; display: flex; gap: 3rem; justify-content: space-between; margin: 0 auto clamp(3rem,7vw,6rem); max-width: var(--max); }.expertise-header h2 { max-width: 720px; }.expertise-header > p { color: #cdd7d1; max-width: 310px; }.expertise-list { border-top: 1px solid rgba(238,229,212,.28); margin: 0 auto; max-width: var(--max); }.expertise-item { align-items: start; border-bottom: 1px solid rgba(238,229,212,.28); display: grid; gap: 2rem; grid-template-columns: .35fr 1fr 1.15fr; padding: 1.7rem 0; transition: padding .3s var(--ease); }.expertise-item:hover { padding-left: 1.2rem; }.item-number { color: #ec9d73; font-family: var(--serif); font-size: 1.3rem; }.expertise-item h3 { color: #f5f0e5; font-family: var(--serif); font-size: clamp(1.5rem,2.3vw,2.25rem); font-weight: 500; letter-spacing: -.04em; margin: 0; }.expertise-item p { color: #bfcbc4; font-size: .9rem; line-height: 1.65; margin: .25rem 0 0; }
.experience { padding: clamp(4.5rem,9vw,9rem) clamp(1.25rem, 6vw, 6rem); }.experience-top { align-items: end; display: flex; gap: 3rem; justify-content: space-between; margin: 0 auto clamp(4rem,9vw,8rem); max-width: var(--max); }.experience-top h2 { max-width: 680px; }.experience-top > p { color: #46545a; max-width: 340px; }.timeline { margin: 0 auto; max-width: var(--max); }.timeline-item { display: grid; gap: clamp(1.5rem,5vw,5rem); grid-template-columns: 125px minmax(0,1fr); position: relative; }.timeline-item::before { background: var(--rule); bottom: 0; content: ''; left: 61px; position: absolute; top: 0; width: 1px; }.time { align-items: center; color: #536269; display: flex; flex-direction: column; font-family: var(--serif); font-size: .86rem; gap: .5rem; padding-top: .25rem; position: relative; z-index: 1; }.time i { background: var(--paper); border: 2px solid var(--moss); border-radius: 50%; height: 11px; width: 11px; }.timeline-item.active .time i { background: var(--copper); border-color: var(--copper); box-shadow: 0 0 0 6px rgba(199,107,59,.14); }.timeline-card { border-bottom: 1px solid var(--rule); padding: 0 0 2.4rem; margin-bottom: 2.4rem; }.timeline-card .role-meta { color: var(--copper-dark); font-size: .66rem; font-weight: 800; letter-spacing: .1em; margin-bottom: .6rem; text-transform: uppercase; }.timeline-card h3 { font-family: var(--serif); font-size: clamp(1.8rem,3vw,2.8rem); font-weight: 500; letter-spacing: -.045em; margin-bottom: .8rem; }.timeline-card > p:not(.role-meta) { color: #3f4c51; max-width: 715px; }.timeline-card ul { color: #55636a; font-size: .86rem; line-height: 1.6; margin: 1.1rem 0 0; max-width: 760px; padding-left: 1.2rem; }.timeline-card li + li { margin-top: .25rem; }.timeline-footnote { color: #637077; font-size: .75rem; font-style: italic; margin: -.5rem auto 0; max-width: var(--max); }
.section-copper { background: var(--copper); color: var(--ink); padding: clamp(4.5rem,9vw,9rem) clamp(1.25rem, 6vw, 6rem); }.impact-heading { max-width: var(--max); margin: 0 auto 3.5rem; }.impact-heading h2 { max-width: 800px; }.impact-layout { display: grid; gap: 1px; grid-template-columns: repeat(5, 1fr); margin: 0 auto; max-width: var(--max); }.impact-feature { border-left: 1px solid rgba(12,31,42,.32); min-height: 290px; padding: 0 1.2rem 1rem; }.impact-feature:first-child { border-left: 0; }.metric { display: block; font-family: var(--serif); font-size: clamp(3.3rem,5.5vw,5.5rem); letter-spacing: -.08em; line-height: .9; margin-bottom: 2.2rem; }.metric span { font-size: .45em; letter-spacing: -.03em; }.impact-feature h3 { font-family: var(--serif); font-size: 1.5rem; font-weight: 500; letter-spacing: -.04em; margin-bottom: .7rem; }.impact-feature p { color: #27353a; font-size: .77rem; line-height: 1.6; }
.systems { padding: clamp(4.5rem,9vw,9rem) clamp(1.25rem, 6vw, 6rem); }.systems-layout { display: grid; gap: clamp(3rem,9vw,9rem); grid-template-columns: minmax(280px,.8fr) minmax(0,1.2fr); margin: 0 auto; max-width: var(--max); }.systems-sticky { align-self: start; position: sticky; top: 120px; }.systems-sticky .section-label { margin-bottom: 4rem; }.systems-sticky h2 { font-size: clamp(2.5rem,4.2vw,4.1rem); }.systems-sticky > p:last-child { color: #4b585c; max-width: 320px; }.system-rows { border-top: 1px solid var(--rule); }.system-row { border-bottom: 1px solid var(--rule); display: grid; gap: 1rem; grid-template-columns: 38px 1fr; padding: 1.6rem 0; }.system-row > span { color: var(--copper-dark); font-family: var(--serif); font-size: 1.2rem; }.system-row h3 { font-family: var(--serif); font-size: 1.65rem; font-weight: 500; letter-spacing: -.04em; margin-bottom: .35rem; }.system-row p { color: #536067; font-size: .85rem; line-height: 1.6; margin: 0; }
.offers { padding: clamp(4.5rem,9vw,9rem) clamp(1.25rem, 6vw, 6rem); }.offers-top { align-items: end; display: flex; gap: 3rem; justify-content: space-between; margin: 0 auto 4rem; max-width: var(--max); }.offers-top h2 { max-width: 710px; }.offers-top > p { color: #4b585e; max-width: 345px; }.offer-cards { display: grid; grid-template-columns: repeat(4,1fr); margin: 0 auto; max-width: var(--max); }.offer-card { background: var(--sand); border-right: 1px solid rgba(12,31,42,.12); display: flex; flex-direction: column; min-height: 335px; padding: 1.5rem; transition: background .25s var(--ease), transform .25s var(--ease); }.offer-card:last-child { border: 0; }.offer-card:hover { background: #e3d6bf; transform: translateY(-7px); }.offer-card.featured { background: var(--ink); color: var(--paper); }.offer-card.featured:hover { background: var(--ink-soft); }.offer-icon { align-items: center; background: var(--ink); color: var(--paper); display: flex; font-family: var(--serif); font-size: 1.25rem; height: 37px; justify-content: center; margin-bottom: 3.3rem; width: 37px; }.featured .offer-icon { background: var(--copper); }.platform { color: var(--copper-dark); font-size: .66rem; font-weight: 800; letter-spacing: .12em; margin-bottom: .7rem; text-transform: uppercase; }.offer-card h3 { font-family: var(--serif); font-size: 1.7rem; font-weight: 500; letter-spacing: -.045em; margin-bottom: .85rem; }.offer-card > p:not(.platform) { color: #526067; font-size: .82rem; line-height: 1.6; }.featured > p:not(.platform) { color: #c8d1cc; }.featured .platform { color: #ec9d73; }.platform-link { color: var(--ink); font-size: .68rem; font-weight: 800; letter-spacing: .08em; margin-top: auto; text-decoration: none; text-transform: uppercase; }.platform-link:hover { color: var(--copper); }.featured .platform-link { color: var(--paper); }.platform-link.placeholder::after { background: var(--copper); border-radius: 50%; content: ''; display: inline-block; height: 5px; margin-left: .5rem; vertical-align: middle; width: 5px; }.offer-note { color: #637077; font-size: .76rem; font-style: italic; margin: 1.25rem auto 0; max-width: var(--max); }
.contact { background: var(--ink); color: var(--paper); overflow: hidden; padding: clamp(5rem,11vw,10rem) clamp(1.25rem, 6vw, 6rem); position: relative; }.contact-content { max-width: 770px; position: relative; }.contact h2 { margin-bottom: 1.5rem; }.contact-content > p:not(.eyebrow) { color: #d4d9d5; font-size: 1.06rem; line-height: 1.7; max-width: 575px; }.contact-actions { align-items: center; display: flex; flex-wrap: wrap; gap: 1.5rem; margin-top: 2rem; }.contact-details { border-left: 1px solid rgba(238,229,212,.35); bottom: clamp(4rem, 11vw, 9rem); display: grid; gap: .3rem; max-width: 250px; padding-left: 1.3rem; position: absolute; right: clamp(1.25rem,6vw,6rem); }.contact-details p { color: #aebbb4; font-size: .64rem; font-weight: 800; letter-spacing: .1em; margin: 0 0 .1rem; text-transform: uppercase; }.contact-details strong, .contact-details a { color: #f1ede3; font-size: .8rem; line-height: 1.45; margin-bottom: 1rem; }.contact-details a:hover { color: #efaa85; }
.site-footer { align-items: center; background: #08171f; color: #bac4bf; display: flex; gap: 1.5rem; justify-content: space-between; padding: 1.5rem clamp(1.25rem,6vw,6rem); }.footer-brand .brand-mark { background: var(--paper); color: var(--ink); }.footer-brand .brand-wordmark strong { color: var(--paper); }.footer-brand .brand-wordmark small { color: #9eaca6; }.site-footer p,.site-footer > a { font-size: .67rem; margin: 0; }.site-footer > a { color: #dfe6e1; text-decoration: none; }
.reveal { opacity: 1; transform: none; }.js .reveal { opacity: 0; transform: translateY(16px); transition: opacity .65s var(--ease), transform .65s var(--ease); }.js .reveal.is-visible { opacity: 1; transform: translateY(0); }
@media (prefers-reduced-motion: reduce) { *,*::before,*::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; } .reveal { opacity: 1; transform: none; } }
@media (max-width: 1040px) { .impact-layout { grid-template-columns: repeat(3,1fr); }.impact-feature:nth-child(4) { border-left: 0; }.offer-cards { grid-template-columns: repeat(2, 1fr); }.offer-card:nth-child(2) { border-right: 0; }.offer-card:nth-child(3) { border-top: 1px solid rgba(12,31,42,.12); }.offer-card:nth-child(4) { border-top: 1px solid rgba(12,31,42,.12); } }
@media (max-width: 780px) { .site-header { min-height: 70px; }.nav-toggle { display: block; }.site-nav { background: var(--paper); border-bottom: 1px solid var(--rule); box-shadow: 0 16px 26px rgba(12,31,42,.08); display: none; flex-direction: column; gap: 1.2rem; left: 0; padding: 1.4rem 1.25rem; position: absolute; right: 0; top: 69px; align-items: flex-start; }.site-nav.open { display: flex; }.hero { min-height: 740px; }.hero-proof { bottom: 4.5rem; flex-direction: row; gap: .8rem; left: 1.25rem; padding-left: .75rem; right: auto; width: auto; }.proof-label { display: none; }.proof-stat strong { font-size: 1.35rem; }.proof-stat span { font-size: .57rem; }.about-layout,.systems-layout { grid-template-columns: 1fr; }.experience-top,.expertise-header,.offers-top { align-items: start; flex-direction: column; gap: 1.4rem; }.experience-top > p,.expertise-header > p,.offers-top > p { max-width: 550px; }.expertise-item { gap: .8rem; grid-template-columns: 35px 1fr; }.expertise-item p { grid-column: 2; margin-top: 0; }.contact-details { display: none; }.systems-sticky { position: static; }.systems-sticky .section-label { margin-bottom: 2.5rem; }.impact-layout { grid-template-columns: repeat(2,1fr); }.impact-feature:nth-child(3) { border-left: 0; }.impact-feature { min-height: 220px; }.site-footer { align-items: flex-start; flex-direction: column; }.timeline-item { gap: 1.25rem; grid-template-columns: 76px minmax(0,1fr); }.timeline-item::before { left: 36px; }.time { font-size: .73rem; } }
@media (max-width: 500px) { h1 { font-size: 3.3rem; }.brand-wordmark small { display: none; }.hero { min-height: auto; padding-bottom: 2.75rem; padding-top: 2.2rem; }.hero-content { padding-top: 0; }.hero-proof { border-left: 0; border-top: 1px solid rgba(238,229,212,.38); bottom: auto; gap: .5rem; left: auto; margin-top: 1.75rem; padding: .9rem 0 0; position: static; right: auto; }.proof-stat { gap: .3rem; }.proof-stat span { display: block; font-size: .55rem; line-height: 1.15; max-width: 54px; }.scroll-cue { bottom: auto; left: auto; margin-top: 1.65rem; position: static; }.intro-band { padding: 3rem 1.25rem; }.credentials div { grid-template-columns: 1fr; gap: .15rem; }.impact-layout,.offer-cards { grid-template-columns: 1fr; }.impact-feature,.impact-feature:nth-child(n) { border-left: 0; border-top: 1px solid rgba(12,31,42,.32); min-height: 0; padding: 1.5rem 0; }.impact-feature:first-child { border-top: 0; padding-top: 0; }.metric { display: inline-block; margin: 0 .9rem 0 0; }.impact-feature h3 { display: inline-block; }.offer-card,.offer-card:nth-child(n) { border-right: 0; border-top: 1px solid rgba(12,31,42,.12); min-height: 250px; }.offer-card:first-child { border-top: 0; }.offer-icon { margin-bottom: 2rem; }.timeline-card { padding-bottom: 1.9rem; margin-bottom: 1.9rem; }.timeline-card ul { font-size: .79rem; }.scroll-cue span { display: none; } }