:root {
  --obsidian: #11110f;
  --obsidian-soft: #171713;
  --ivory: #f1ede2;
  --muted: #bcb5a6;
  --gold: #b99859;
  --gold-light: #d5bc82;
  --line: rgba(241, 237, 226, 0.2);
  --serif: "Playfair Display", Georgia, serif;
  --sans: "Manrope", Arial, sans-serif;
  --mono: "DM Mono", monospace;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; background: var(--obsidian); }
body { margin: 0; color: var(--ivory); background: var(--obsidian); font-family: var(--sans); font-size: 16px; -webkit-font-smoothing: antialiased; }
a { color: inherit; text-decoration: none; }
button { font: inherit; }
.grain { position: fixed; z-index: 20; inset: 0; pointer-events: none; opacity: .035; background-image: url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E"); }
.section-shell { margin: 0 auto; max-width: 1440px; padding-left: clamp(24px, 5.55vw, 80px); padding-right: clamp(24px, 5.55vw, 80px); }
.section-space { padding-top: clamp(110px, 14vw, 205px); padding-bottom: clamp(110px, 14vw, 205px); }

.site-header { height: 86px; max-width: 1440px; padding: 0 clamp(24px, 5.55vw, 80px); margin: auto; display: flex; align-items: center; justify-content: space-between; position: relative; z-index: 10; }
.wordmark { letter-spacing: .15em; font-size: 17px; font-weight: 700; line-height: 1; }
.wordmark span { color: var(--gold); font-size: 7px; vertical-align: top; margin-left: 2px; }
.site-nav { display: flex; align-items: center; gap: clamp(20px, 2.65vw, 38px); font-size: 11px; letter-spacing: .07em; text-transform: uppercase; }
.site-nav > a:not(.nav-cta) { color: var(--muted); transition: color .2s ease; }
.site-nav > a:not(.nav-cta):hover { color: var(--ivory); }
.nav-cta { color: var(--gold-light); border-bottom: 1px solid var(--gold); padding-bottom: 5px; }
.nav-cta i { font-size: 15px; font-style: normal; margin-left: 5px; }
.menu-toggle { display: none; color: var(--ivory); background: transparent; border: 0; padding: 10px 0 10px 10px; }

.hero { min-height: calc(100vh - 86px); position: relative; padding-top: clamp(25px, 4vw, 64px); display: flex; flex-direction: column; overflow: hidden; }
.hero-rule { height: 1px; width: 100%; background: var(--line); }
.eyebrow, .section-index { margin: 21px 0 0; color: var(--muted); font-family: var(--mono); font-size: 10px; letter-spacing: .08em; line-height: 1.5; text-transform: uppercase; }
.eyebrow span { float: right; color: var(--gold); }
.hero-grid { position: relative; display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 50px; margin-top: clamp(60px, 9.4vw, 135px); }
.hero-title { position: relative; z-index: 2; max-width: 900px; margin: 0; font-family: var(--serif); font-size: clamp(53px, 8.15vw, 117px); line-height: .92; font-weight: 500; letter-spacing: -.065em; }
.hero-title em, .display-copy em, .capability h2 em, .approach h2 em, .contact h2 em, .signal-panel em { color: var(--gold-light); font-weight: 500; }
.hero-side { position: relative; z-index: 3; align-self: end; margin-bottom: 6px; }
.hero-side p, .body-copy, .capability p, .process-list p, .proof-points p { color: var(--muted); font-size: 13px; line-height: 1.7; }
.hero-side p { margin: 0 0 33px; }
.text-link { display: inline-block; padding-bottom: 7px; border-bottom: 1px solid var(--gold); color: var(--gold-light); font-family: var(--mono); font-size: 10px; letter-spacing: .06em; text-transform: uppercase; }
.text-link span { margin-left: 12px; font-size: 15px; }
.hero-mark { position: absolute; right: 18%; top: 50%; transform: translateY(-48%); width: min(46vw, 610px); aspect-ratio: 1; color: var(--gold); opacity: .92; pointer-events: none; }
.mark-label { position: absolute; z-index: 2; inset: 50% auto auto 50%; transform: translate(-50%, -55%); font-family: var(--serif); font-size: clamp(75px, 12vw, 180px); line-height: 1; color: rgba(213, 188, 130, .2); }
.mark-ring { position: absolute; border: 1px solid rgba(185, 152, 89, .32); border-radius: 50%; }
.ring-one { width: 100%; height: 38%; top: 31%; left: 0; transform: rotate(-27deg); }
.ring-two { width: 38%; height: 100%; left: 31%; top: 0; transform: rotate(29deg); }
.ring-three { width: 86%; height: 86%; top: 7%; left: 7%; border-color: rgba(185, 152, 89, .15); }
.mark-core { position: absolute; top: calc(50% - 4px); left: calc(50% - 4px); width: 8px; height: 8px; border-radius: 50%; background: var(--gold-light); box-shadow: 0 0 28px 8px rgba(185, 152, 89, .22); }
.hero-foot { margin-top: auto; padding: 45px 0 25px; display: grid; grid-template-columns: 1fr 1fr 1fr 2fr; gap: 16px; border-top: 1px solid var(--line); color: var(--gold); font-family: var(--mono); font-size: 10px; letter-spacing: .07em; text-transform: uppercase; }
.hero-foot p { margin: 0; color: var(--muted); text-align: right; }

.manifesto { background: var(--ivory); color: var(--obsidian); display: grid; grid-template-columns: 1fr minmax(0, 3fr); gap: 30px; }
.manifesto .section-index { color: #817c70; margin-top: 8px; }
.section-index span { color: var(--gold); margin: 0 5px; }
.manifesto-copy { max-width: 910px; }
.display-copy { margin: 0; font-family: var(--serif); font-size: clamp(35px, 5vw, 72px); line-height: 1.04; letter-spacing: -.055em; }
.display-copy em { color: #857043; }
.body-copy { max-width: 410px; margin: 38px 0 0 auto; color: #59564f; }

.capabilities { background: #1a1a15; }
.section-intro { margin-bottom: clamp(58px, 7vw, 100px); display: flex; justify-content: space-between; align-items: flex-start; }
.section-intro .eyebrow { margin: 0; }
.capability-list { border-top: 1px solid var(--line); }
.capability { position: relative; padding: 31px 0 37px; display: grid; grid-template-columns: 16% 1fr auto; gap: 24px; align-items: start; border-bottom: 1px solid var(--line); transition: padding-left .35s ease, background .35s ease; }
.capability:hover { padding-left: 20px; background: rgba(241, 237, 226, .035); }
.capability-number { padding-top: 11px; color: var(--gold); font-family: var(--mono); font-size: 11px; }
.capability h2 { margin: 0; font-family: var(--serif); font-size: clamp(31px, 3.7vw, 53px); font-weight: 500; line-height: .95; letter-spacing: -.055em; }
.capability p { max-width: 350px; margin: 18px 0 0; }
.capability-arrow { padding-top: 5px; color: var(--gold-light); font-size: 20px; }

.signal { padding-top: clamp(65px, 9vw, 125px); padding-bottom: clamp(65px, 9vw, 125px); background: #1a1a15; }
.signal-panel { min-height: 450px; padding: 24px 30px 35px; overflow: hidden; position: relative; display: flex; flex-direction: column; justify-content: space-between; background: var(--gold); color: #17150f; }
.signal-topline { display: flex; justify-content: space-between; position: relative; z-index: 2; font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.signal-panel p { position: relative; z-index: 2; margin: 75px 0 0; max-width: 800px; font-family: var(--serif); font-size: clamp(38px, 5.3vw, 76px); line-height: .95; letter-spacing: -.06em; }
.signal-panel em { color: var(--obsidian); }
.signal-figure { position: absolute; z-index: 1; right: 4%; bottom: -17%; color: rgba(17, 17, 15, .14); font-family: var(--serif); font-size: clamp(300px, 37vw, 560px); line-height: .6; }
.signal-lines { position: absolute; inset: 0; opacity: .23; display: flex; flex-direction: column; justify-content: space-evenly; }
.signal-lines i { display: block; border-top: 1px solid #17150f; transform-origin: left; }
.signal-lines i:nth-child(2n) { transform: rotate(-7deg) scaleX(1.2); }.signal-lines i:nth-child(3n) { transform: rotate(7deg) scaleX(1.1); }.signal-lines i:nth-child(4n) { transform: rotate(-4deg); }

.approach { background: var(--obsidian-soft); display: grid; grid-template-columns: 1fr 1.9fr; gap: clamp(48px, 10vw, 170px); }
.approach-heading h2 { margin: 36px 0 0; font-family: var(--serif); font-size: clamp(37px, 4.3vw, 62px); line-height: .98; font-weight: 500; letter-spacing: -.06em; }
.process-list { list-style: none; padding: 0; margin: 0; border-top: 1px solid var(--line); }
.process-list li { padding: 27px 0; display: grid; grid-template-columns: 84px 1fr; gap: 22px; border-bottom: 1px solid var(--line); }
.process-list li > span { color: var(--gold); font-family: var(--mono); font-size: 10px; padding-top: 6px; }
.process-list h3 { margin: 0; font-family: var(--serif); font-size: 26px; font-weight: 500; letter-spacing: -.04em; }
.process-list p { max-width: 330px; margin: 8px 0 0; }

.proof { background: var(--ivory); color: var(--obsidian); }
.proof .section-index { margin-top: 0; color: #817c70; }
.proof-grid { margin-top: clamp(55px, 8vw, 120px); display: grid; grid-template-columns: 1.7fr 1fr; gap: 12%; }
.proof-quote { max-width: 690px; margin: 0; font-family: var(--serif); font-size: clamp(34px, 4vw, 58px); line-height: 1.04; letter-spacing: -.055em; }
.proof-points { border-top: 1px solid rgba(17, 17, 15, .25); }
.proof-points div { padding: 18px 0; border-bottom: 1px solid rgba(17, 17, 15, .25); }
.proof-points span { color: #806b42; font-family: var(--mono); font-size: 10px; letter-spacing: .07em; text-transform: uppercase; }
.proof-points p { margin: 10px 0 0; color: #59564f; }

.contact { min-height: 710px; position: relative; padding-top: 25px; display: flex; flex-direction: column; background: var(--obsidian); overflow: hidden; }
.contact::after { content: "M"; position: absolute; z-index: 0; right: -5%; bottom: -20%; color: rgba(213, 188, 130, .035); font-family: var(--serif); font-size: min(77vw, 1000px); line-height: 1; }
.contact-top { position: relative; z-index: 1; padding-top: 18px; display: flex; justify-content: space-between; border-top: 1px solid var(--line); color: var(--muted); font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.contact-content { position: relative; z-index: 1; margin: auto 0; padding: 60px 0; }
.contact-kicker { margin: 0 0 22px; color: var(--gold); font-family: var(--mono); font-size: 10px; letter-spacing: .08em; text-transform: uppercase; }
.contact h2 { margin: 0; font-family: var(--serif); font-size: clamp(60px, 9.3vw, 134px); line-height: .87; font-weight: 500; letter-spacing: -.07em; }
.button { display: inline-flex; align-items: center; gap: 45px; margin-top: 46px; padding: 17px 18px 17px 22px; background: var(--gold); color: var(--obsidian); font-family: var(--mono); font-size: 10px; letter-spacing: .05em; text-transform: uppercase; transition: background .2s ease, transform .2s ease; }
.button:hover { background: var(--gold-light); transform: translateY(-2px); }.button span { font-size: 18px; }
.contact-note { margin: 20px 0 0; color: var(--muted); font-size: 11px; }
footer { position: relative; z-index: 1; padding: 22px 0 25px; display: grid; grid-template-columns: 1fr 1fr auto; gap: 20px; border-top: 1px solid var(--line); color: var(--muted); font-family: var(--mono); font-size: 10px; letter-spacing: .05em; text-transform: uppercase; } footer a:hover { color: var(--gold-light); }

.reveal { opacity: 0; transform: translateY(20px); transition: opacity .7s ease, transform .7s ease; }.reveal.is-visible { opacity: 1; transform: none; }.capability.reveal:nth-child(2) { transition-delay: .08s; }.capability.reveal:nth-child(3) { transition-delay: .16s; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; }.reveal { opacity: 1; transform: none; transition: none; } * { animation-duration: .01ms !important; } }
@media (max-width: 760px) {
  .site-header { height: 72px; }.site-nav { position: absolute; visibility: hidden; opacity: 0; top: 72px; left: 0; right: 0; padding: 22px 24px 27px; flex-direction: column; align-items: flex-start; gap: 19px; background: #1a1a15; transform: translateY(-10px); transition: visibility .2s, opacity .2s, transform .2s; }.site-nav.is-open { visibility: visible; opacity: 1; transform: none; }.menu-toggle { display: grid; gap: 5px; }.menu-toggle span { display: block; width: 22px; height: 1px; background: currentColor; transition: transform .2s; }.menu-toggle[aria-expanded="true"] span:first-child { transform: translateY(3px) rotate(45deg); }.menu-toggle[aria-expanded="true"] span:last-child { transform: translateY(-3px) rotate(-45deg); }
  .hero { min-height: calc(100svh - 72px); }.hero-grid { grid-template-columns: 1fr; gap: 38px; margin-top: 63px; }.hero-title { font-size: clamp(50px, 15vw, 76px); }.hero-side { max-width: 245px; }.hero-mark { right: -7%; top: 38%; width: 83vw; }.hero-foot { padding-top: 26px; grid-template-columns: repeat(3, 1fr); gap: 15px 5px; }.hero-foot p { grid-column: 1 / -1; text-align: left; }
  .manifesto { grid-template-columns: 1fr; gap: 32px; }.body-copy { margin: 31px 0 0; }.section-intro { display: block; }.section-intro .eyebrow { margin-top: 22px; }.capability { grid-template-columns: 42px 1fr auto; gap: 10px; }.capability p { font-size: 12px; }.signal-panel { min-height: 370px; padding: 20px; }.signal-topline span:last-child { display: none; }
  .approach { grid-template-columns: 1fr; gap: 65px; }.proof-grid { grid-template-columns: 1fr; gap: 60px; }.contact { min-height: 620px; } footer { grid-template-columns: 1fr 1fr; } footer a:last-child { grid-column: 1 / -1; }
}
@media (max-width: 400px) { .hero-title { font-size: 48px; }.hero-foot { font-size: 8px; }.capability h2 { font-size: 29px; }.contact h2 { font-size: 57px; } }

