:root {
  --paper: #e9e6df;
  --ink: #202421;
  --muted: #4f5852;
  --line: #c4c5bd;
  --accent: #d8c58f;
  --coral: #654a38;
  --serif: Georgia, 'Times New Roman', serif;
  --sans: 'Manrope', sans-serif;
  --mono: 'DM Mono', monospace;
}

* { 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.5; }
a { color: inherit; text-decoration: none; }
.site-header { align-items: center; border-bottom: 1px solid var(--line); display: flex; height: 82px; justify-content: space-between; padding: 0 5vw; }
.brand { align-items: center; display: flex; font-size: 11px; font-weight: 800; gap: 10px; letter-spacing: .04em; line-height: 1.1; text-transform: uppercase; }
.desktop-nav { display: flex; gap: 36px; margin-left: 10vw; }
.desktop-nav a, .header-link, .menu-toggle { font-family: var(--mono); font-size: 11px; text-transform: uppercase; }
.desktop-nav a:hover, .header-link:hover { color: var(--coral); }
.header-link span, .button span { font-size: 18px; margin-left: 12px; }
.menu-toggle, .mobile-nav { display: none; }
.section-grid { display: grid; grid-template-columns: 25% 75%; padding: 0 5vw; }
.hero { min-height: 660px; padding-top: 90px; }
.hero-copy { grid-column: 1 / -1; max-width: 760px; padding-right: 8vw; }
.eyebrow { font-family: var(--mono); font-size: 11px; letter-spacing: .04em; margin: 0 0 30px; text-transform: uppercase; }
.eyebrow span { color: var(--coral); }
h1, h2, h3, p { margin-top: 0; }
h1 { font-size: clamp(54px, 7vw, 108px); letter-spacing: -.065em; line-height: .94; margin-bottom: 35px; }
h1 em, h2 em { font-family: var(--serif); font-weight: 400; letter-spacing: -.06em; }
.hero-intro { color: var(--muted); font-size: 17px; max-width: 420px; }
.button { border: 0; display: inline-flex; font-family: var(--mono); font-size: 11px; justify-content: space-between; margin-top: 28px; padding: 17px 20px; text-transform: uppercase; }
.button-dark { background: var(--ink); color: var(--paper); min-width: 220px; }
.button-accent { background: var(--accent); color: var(--ink); cursor: pointer; min-width: 190px; }
.button:hover { transform: translateY(-2px); }
.network, .approach { border-top: 1px solid var(--line); padding-bottom: 130px; padding-top: 42px; }
.section-label { display: flex; font-family: var(--mono); font-size: 10px; gap: 22px; text-transform: uppercase; }.section-label span:first-child { color: var(--coral); }
.network-content h2 { font-size: clamp(42px, 5.5vw, 82px); letter-spacing: -.065em; line-height: 1; margin: 0 0 34px; }.network-content h2 span { font-family: var(--serif); font-weight: 400; }
.large-copy { color: var(--muted); font-size: 20px; max-width: 610px; }.group-note { align-items: center; border-top: 1px solid var(--line); display: flex; gap: 28px; margin-top: 72px; padding-top: 25px; }.group-note span { font-family: var(--mono); font-size: 10px; text-transform: uppercase; }.group-note strong { font-family: var(--serif); font-size: 52px; font-weight: 400; }
.company-link { border-bottom: 1px solid var(--ink); display: inline-flex; font-family: var(--mono); font-size: 11px; gap: 18px; margin-top: 32px; padding-bottom: 8px; text-transform: uppercase; }.company-link span { color: var(--coral); font-size: 17px; line-height: .7; }.company-link:hover { border-color: var(--coral); color: var(--coral); }
.approach-list article { align-items: flex-start; border-top: 1px solid var(--line); display: grid; gap: 24px; grid-template-columns: 45px 1fr 30px; padding: 28px 0; }.approach-list article:last-child { border-bottom: 1px solid var(--line); }.item-number { color: var(--coral); font-family: var(--mono); font-size: 11px; }.approach h3 { font-size: 27px; letter-spacing: -.04em; margin: 0 0 7px; }.approach p { color: var(--muted); margin: 0; max-width: 450px; }.item-arrow { font-size: 24px; }
.contact { background: var(--ink); color: var(--paper); padding-bottom: 115px; padding-top: 100px; }.contact .eyebrow { color: var(--accent); }.contact-heading h2 { font-size: clamp(43px, 5.5vw, 78px); letter-spacing: -.07em; line-height: .98; }.contact-heading h2 em { color: var(--accent); }.contact-heading > p:last-child { color: #aeb5ae; max-width: 310px; }.contact-form { max-width: 600px; }.contact-form label { color: #aeb5ae; display: block; font-family: var(--mono); font-size: 10px; margin: 0 0 7px; text-transform: uppercase; }.contact-form label:not(:first-child) { margin-top: 26px; }.contact-form label span { color: var(--coral); }.contact-form input, .contact-form textarea { background: transparent; border: 0; border-bottom: 1px solid #53605a; border-radius: 0; color: var(--paper); font: inherit; outline: 0; padding: 9px 0; width: 100%; }.contact-form input:focus, .contact-form textarea:focus { border-color: var(--accent); }.contact-form textarea { resize: vertical; }.form-footer { align-items: center; display: flex; justify-content: space-between; }.form-status { color: var(--accent); font-size: 13px; margin: 28px 20px 0 0; }
.site-footer { align-items: flex-start; background: var(--ink); border-top: 1px solid #53615a; color: var(--paper); display: flex; justify-content: space-between; padding: 38px 5vw 48px; }.site-footer .brand-mark { background: var(--accent); color: var(--ink); }.site-footer p { color: #aeb5ae; font-family: var(--mono); font-size: 10px; line-height: 1.6; text-transform: uppercase; }.footer-meta { text-align: right; }
@media (max-width: 700px) { .site-header { height: 72px; padding: 0 22px; }.desktop-nav, .header-link { display: none; }.menu-toggle { background: none; border: 0; color: var(--ink); display: block; padding: 10px 0; }.mobile-nav { border-bottom: 1px solid var(--line); display: none; padding: 12px 22px; }.mobile-nav.is-open { display: grid; gap: 12px; }.mobile-nav a { font-family: var(--mono); font-size: 11px; text-transform: uppercase; }.section-grid { display: block; padding-left: 22px; padding-right: 22px; }.hero { padding-top: 64px; }.hero-copy { padding: 0; }.hero-art { margin-top: 60px; min-height: 360px; }.node { font-size: 9px; padding: 14px 10px; }.network, .approach { padding-bottom: 80px; padding-top: 30px; }.section-label { margin-bottom: 44px; }.group-note { gap: 18px; margin-top: 52px; }.group-note strong { font-size: 43px; }.approach-list article { gap: 12px; grid-template-columns: 32px 1fr 24px; }.approach h3 { font-size: 22px; }.contact { padding-bottom: 75px; padding-top: 70px; }.contact-heading { margin-bottom: 58px; }.form-footer { align-items: flex-start; display: block; }.form-status { min-height: 20px; }.site-footer { display: grid; gap: 30px; padding: 30px 22px; }.footer-meta { text-align: left; } }
