:root { --ink:#11110f; --paper:#f2f0e9; --muted:#77766f; --line:rgba(17,17,15,.18); --acid:#d9ff43; --white:#fffef8; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Arial,Helvetica,sans-serif; -webkit-font-smoothing:antialiased; }
a { color:inherit; text-decoration:none; }
img { display:block; max-width:100%; }

.site-header { align-items:center; background:var(--paper); border-bottom:1px solid var(--line); display:grid; grid-template-columns:1fr auto 1fr; height:82px; padding:0 clamp(24px,4vw,72px); position:relative; z-index:10; }
.wordmark { font-size:25px; font-weight:900; letter-spacing:-.055em; line-height:1; justify-self:start; }
.wordmark-dot,.hero h1 span,.manifesto span { color:var(--acid); }
.site-header nav { display:flex; gap:38px; }
.site-header nav a,.header-cta { font-size:12px; font-weight:700; letter-spacing:.12em; text-transform:uppercase; }
.site-header nav a { transition:opacity 180ms ease; }
.site-header nav a:hover { opacity:.5; }
.header-cta { border-bottom:2px solid var(--ink); justify-self:end; padding-bottom:5px; }

.hero { color:var(--white); min-height:calc(100vh - 82px); overflow:hidden; position:relative; }
.hero-image,.hero-shade { height:100%; inset:0; position:absolute; width:100%; }
.hero-image { object-fit:cover; object-position:55% 36%; }
.hero-shade { background:linear-gradient(90deg,rgba(8,10,8,.82) 0%,rgba(8,10,8,.48) 46%,rgba(8,10,8,.08) 74%),linear-gradient(0deg,rgba(8,10,8,.42),transparent 45%); }
.hero-content { margin-left:clamp(24px,8vw,150px); max-width:930px; padding:clamp(110px,17vh,190px) 24px 110px 0; position:relative; z-index:2; }
.eyebrow { align-items:center; color:#67675f; display:flex; font-size:11px; font-weight:800; gap:12px; letter-spacing:.19em; margin:0 0 26px; text-transform:uppercase; }
.eyebrow::before { background:var(--acid); content:""; height:8px; width:8px; }
.eyebrow.light { color:rgba(255,254,248,.75); }
.hero h1 { font-size:clamp(58px,8vw,132px); font-weight:800; letter-spacing:-.065em; line-height:.87; margin:0; text-wrap:balance; }
.hero-copy { font-size:clamp(16px,1.35vw,20px); line-height:1.55; margin:38px 0 36px; max-width:620px; }
.button { align-items:center; display:inline-flex; font-size:12px; font-weight:800; gap:28px; letter-spacing:.11em; padding:18px 21px; text-transform:uppercase; }
.button-accent { background:var(--acid); color:var(--ink); transition:background 180ms ease,transform 180ms ease; }
.button-accent:hover { background:var(--white); transform:translateY(-2px); }
.hero-side-note { bottom:44px; font-size:10px; font-weight:700; letter-spacing:.18em; margin:0; position:absolute; right:35px; text-transform:uppercase; transform:rotate(-90deg) translateX(100%); transform-origin:right bottom; z-index:2; }

.section { display:grid; grid-template-columns:minmax(150px,1fr) minmax(0,4fr); padding:clamp(90px,12vw,190px) clamp(24px,8vw,150px); }
.section-label { align-self:start; display:flex; gap:14px; }
.section-label span { font-size:11px; font-weight:800; }
.section-label p { font-size:10px; font-weight:700; letter-spacing:.16em; margin:0; text-transform:uppercase; }
.intro-content,.services-content { max-width:1110px; }
.intro h2,.services h2,.about h2,.contact h2 { font-size:clamp(46px,6.6vw,106px); font-weight:800; letter-spacing:-.065em; line-height:.92; margin:0; }
.two-column-copy { border-top:1px solid var(--line); display:grid; gap:clamp(40px,6vw,96px); grid-template-columns:1fr 1fr; margin-top:clamp(54px,7vw,92px); padding-top:28px; }
.two-column-copy p,.about-copy>p { font-size:17px; line-height:1.7; margin:0; }

.services { background:var(--ink); color:var(--white); }
.light-label { color:rgba(255,254,248,.55); }
.service-list { border-top:1px solid rgba(255,255,255,.22); margin-top:clamp(60px,8vw,110px); }
.service { align-items:start; border-bottom:1px solid rgba(255,255,255,.22); display:grid; gap:28px; grid-template-columns:52px minmax(220px,.8fr) minmax(280px,1fr); padding:32px 0; }
.service>span { color:var(--acid); font-size:11px; font-weight:800; }
.service h3 { font-size:clamp(20px,2vw,29px); letter-spacing:-.035em; margin:0; }
.service p { color:rgba(255,254,248,.67); font-size:15px; line-height:1.65; margin:0; }

.manifesto { align-items:center; color:var(--white); display:flex; height:min(78vw,760px); min-height:560px; overflow:hidden; padding:clamp(30px,8vw,150px); position:relative; }
.manifesto img,.manifesto-shade { height:100%; inset:0; position:absolute; width:100%; }
.manifesto img { object-fit:cover; object-position:78% center; }
.manifesto-shade { background:rgba(6,11,12,.48); }
.manifesto p { font-size:clamp(38px,5vw,80px); font-weight:800; letter-spacing:-.055em; line-height:1; margin:0; max-width:1100px; position:relative; z-index:2; }

.about-grid { display:grid; gap:clamp(50px,8vw,120px); grid-template-columns:minmax(280px,.85fr) minmax(360px,1.15fr); max-width:1110px; }
.portrait-wrap { margin:0; }
.portrait-wrap img { aspect-ratio:.76; filter:saturate(.68) contrast(1.04); height:auto; object-fit:cover; object-position:42% center; width:100%; }
.portrait-wrap figcaption { border-bottom:1px solid var(--line); font-size:10px; font-weight:700; letter-spacing:.13em; padding:16px 0; text-transform:uppercase; }
.about-copy h2 { font-size:clamp(43px,4.8vw,78px); margin-bottom:46px; }
.about-copy>p { margin-bottom:22px; }
.about-copy .pull-quote { border-left:7px solid var(--acid); font-size:clamp(20px,2vw,28px); font-weight:700; line-height:1.35; margin-top:42px; padding-left:24px; }

.contact { background:var(--ink); color:var(--white); padding:clamp(90px,12vw,180px) clamp(24px,8vw,150px); }
.contact h2 { max-width:1050px; }
.contact>p:not(.eyebrow) { color:rgba(255,254,248,.66); font-size:18px; line-height:1.6; margin:42px 0 70px; max-width:600px; }
.contact-link { border-bottom:2px solid var(--acid); display:flex; font-size:clamp(23px,3.5vw,54px); font-weight:800; justify-content:space-between; letter-spacing:-.04em; padding-bottom:14px; transition:color 180ms ease; }
.contact-link:hover { color:var(--acid); }

footer { align-items:end; background:var(--ink); border-top:1px solid rgba(255,255,255,.2); color:rgba(255,254,248,.62); display:grid; font-size:10px; font-weight:700; gap:30px; grid-template-columns:1fr 1.5fr 1.5fr; letter-spacing:.1em; padding:35px clamp(24px,8vw,150px); text-transform:uppercase; }
footer p { margin:0; }
footer p:last-child { text-align:right; }
.footer-wordmark { color:var(--white); }

@media (max-width:900px) {
  .site-header { grid-template-columns:1fr auto; }
  .site-header nav { display:none; }
  .hero-content { margin-left:7vw; }
  .section { display:block; }
  .section-label { border-bottom:1px solid var(--line); margin-bottom:65px; padding-bottom:16px; }
  .services .section-label { border-color:rgba(255,255,255,.2); }
  .about-grid { grid-template-columns:minmax(260px,.8fr) minmax(330px,1.2fr); gap:50px; }
  footer { grid-template-columns:1fr; }
  footer p:last-child { text-align:left; }
}

@media (max-width:650px) {
  .site-header { height:66px; padding:0 20px; }
  .wordmark { font-size:22px; }
  .header-cta { font-size:10px; }
  .hero { min-height:calc(100svh - 66px); }
  .hero-image { object-position:48% center; }
  .hero-shade { background:linear-gradient(0deg,rgba(8,10,8,.88) 5%,rgba(8,10,8,.42) 74%,rgba(8,10,8,.2)); }
  .hero-content { margin:0; padding:47vh 20px 55px; }
  .hero h1 { font-size:clamp(47px,14vw,72px); line-height:.9; }
  .hero-copy { font-size:15px; line-height:1.5; margin:26px 0; }
  .hero-side-note { display:none; }
  .section { padding:86px 20px; }
  .section-label { margin-bottom:45px; }
  .intro h2,.services h2,.about h2,.contact h2 { font-size:45px; }
  .two-column-copy { grid-template-columns:1fr; margin-top:45px; gap:18px; }
  .two-column-copy p,.about-copy>p { font-size:16px; }
  .service { gap:13px; grid-template-columns:34px 1fr; padding:26px 0; }
  .service p { grid-column:2; }
  .manifesto { height:620px; min-height:0; padding:20px; }
  .manifesto img { object-position:73% center; }
  .manifesto p { font-size:41px; }
  .about-grid { display:flex; flex-direction:column; gap:55px; }
  .portrait-wrap { order:2; }
  .about-copy { order:1; }
  .contact { padding:90px 20px; }
  .contact>p:not(.eyebrow) { font-size:16px; margin:28px 0 50px; }
  .contact-link { font-size:22px; }
  footer { padding:32px 20px 45px; }
}

@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } * { transition:none!important; } }
