@import url('https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:opsz,wght@12..96,400;12..96,500;12..96,600;12..96,700&family=IBM+Plex+Mono:wght@400;500;600&display=swap');

:root { --ink:#27344d; --paper:#e8f0ed; --cream:#f7faf6; --olive:#236b68; --rust:#c45f4d; --muted:#68758a; --line:rgba(39,52,77,.18); --serif:'Bricolage Grotesque', Georgia, sans-serif; --sans:'IBM Plex Mono', 'Courier New', monospace; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; color:var(--ink); background:var(--paper); font:15px/1.55 var(--sans); }
a { color:inherit; text-decoration:none; }
.back-link { position:fixed; z-index:10; top:12px; left:28px; font-size:10px; text-transform:uppercase; letter-spacing:.08em; border-bottom:1px solid currentColor; }
.site-header { position:absolute; z-index:5; inset:0 0 auto; display:grid; grid-template-columns:1fr auto 1fr; align-items:start; padding:28px 5vw; }
.mark { font-size:17px; font-weight:700; letter-spacing:.08em; line-height:1; text-transform:uppercase; }
.mark small { display:block; margin-top:8px; color:var(--muted); font-size:9px; font-weight:500; letter-spacing:.16em; }
.header-center { font:italic 20px var(--serif); }
.site-nav { justify-self:end; display:flex; gap:24px; font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.site-nav a:hover,.site-nav a.active { color:var(--rust); }
.menu-toggle { display:none; background:none; border:0; font:inherit; }
.hero { min-height:100svh; padding:125px 5vw 48px; display:flex; flex-direction:column; gap:46px; }
.hero-copy { display:grid; grid-template-columns:1fr 1.8fr; gap:2vw 7vw; padding:0 3vw 0 0; order:2; }
.eyebrow,.meta,.label { color:var(--muted); font-size:10px; text-transform:uppercase; letter-spacing:.14em; }
.eyebrow { margin:0 0 22px; }
h1,h2,h3,p { margin-top:0; }
h1 { max-width:760px; margin-bottom:28px; font:500 clamp(57px,8.6vw,140px)/.92 var(--serif); letter-spacing:-.055em; grid-column:2; }
h1 em,h2 em { color:var(--rust); }
.hero-copy > p:not(.eyebrow) { max-width:385px; color:var(--muted); grid-column:2; }
.hero-image { order:1; width:100%; height:52vh; min-height:390px; position:relative; display:block; overflow:hidden; border-radius:0; border:1px solid var(--ink); box-shadow:18px 18px 0 var(--rust); }
.hero-image img,.project-image img,.feature-image img { width:100%; height:100%; display:block; object-fit:cover; filter:saturate(.8) contrast(1.05); }
.image-note { position:absolute; bottom:17px; left:18px; color:white; font-size:10px; letter-spacing:.08em; text-transform:uppercase; text-shadow:0 1px 12px #000; }
.round-link { display:grid; place-items:center; width:64px; height:64px; margin-top:8px; border:1px solid var(--ink); border-radius:50%; font-size:24px; transition:.25s; grid-column:2; }
.round-link:hover { background:var(--olive); color:var(--cream); border-color:var(--olive); }
.band { padding:120px 5vw; border-top:1px solid var(--line); }
.intro { display:grid; grid-template-columns:1fr 2fr; gap:7vw; }
.intro h2 { max-width:900px; margin:0; font:500 clamp(38px,5.2vw,76px)/1.02 var(--serif); letter-spacing:-.045em; }
.intro-copy { max-width:370px; color:var(--muted); }
.stats { display:grid; grid-template-columns:repeat(3,1fr); gap:28px; margin-top:95px; padding-top:22px; border-top:1px solid var(--line); }
.stats strong { display:block; color:var(--olive); font:500 clamp(34px,4vw,58px) var(--serif); }
.stats span { color:var(--muted); font-size:11px; text-transform:uppercase; letter-spacing:.08em; }
.section-head { display:flex; justify-content:space-between; margin-bottom:48px; }
.section-head h2 { margin:0; font:500 clamp(38px,5vw,70px) var(--serif); letter-spacing:-.05em; }
.projects { background:var(--cream); }
.project-grid { display:grid; grid-template-columns:1.65fr 1fr; gap:4vw; align-items:center; }
.project-grid .project:first-child { grid-row:span 2; }
.project-grid .project:first-child .project-image { height:68vw; max-height:760px; }
.project-grid .project:last-child .project-image { height:28vw; max-height:360px; }
.project-grid + .project-grid { margin-top:110px; grid-template-columns:1fr 1.65fr; }
.project-grid + .project-grid .project:first-child { grid-column:2; grid-row:span 2; }
.project-grid + .project-grid .project:last-child { grid-column:1; grid-row:1; }
.project-grid + .project-grid .project:first-child .project-image { height:68vw; max-height:760px; }
.project-grid + .project-grid .project:last-child .project-image { height:28vw; max-height:360px; }
.project-image { height:42vw; max-height:600px; display:block; overflow:hidden; border-radius:0; border:1px solid var(--ink); }
.project-image img,.feature-image img { transition:transform .7s; }
.project-image:hover img,.feature-image:hover img { transform:scale(1.035); }
.project-info { padding-bottom:10px; }
.project-info h3 { margin:10px 0 5px; font:500 clamp(25px,3vw,43px) var(--serif); }
.project-info p { margin:0; color:var(--muted); }
.arrow-link { display:inline-block; margin-top:26px; color:var(--rust); font-size:11px; text-transform:uppercase; letter-spacing:.1em; }
.service-row { display:grid; grid-template-columns:80px 1fr 30px; align-items:center; padding:27px 0; border-top:1px solid var(--line); }
.service-row:last-child { border-bottom:1px solid var(--line); }
.service-row h3 { margin:0; font:500 clamp(28px,4vw,60px) var(--serif); }
.service-row span:last-child { color:var(--rust); font-size:24px; }
.cta { display:grid; grid-template-columns:1fr 2fr; gap:7vw; background:var(--olive); color:var(--cream); }
.cta h2 { margin:0; max-width:850px; font:500 clamp(44px,7vw,106px)/.98 var(--serif); letter-spacing:-.06em; }
.cta h2 em { color:#f2b09a; }
.cta .arrow-link { color:#f2b09a; }
.footer { display:flex; justify-content:space-between; padding:24px 5vw; background:var(--ink); color:#c1ccdc; font-size:10px; text-transform:uppercase; letter-spacing:.08em; }
.page-main { padding:170px 5vw 120px; }
.page-title { display:grid; grid-template-columns:1fr 2fr; gap:7vw; padding-bottom:100px; }
.page-title h1 { grid-column:2; margin:0; }
.contact-page .page-title h1 { max-width:700px; font-size:clamp(48px,7vw,100px); }
.work-page .page-title h1 { max-width:none; white-space:nowrap; font-size:clamp(42px,5.2vw,78px); }
.feature-image { display:block; border-radius:0; border:1px solid var(--ink); box-shadow:12px 12px 0 var(--olive); }
.page-lead { grid-column:2; max-width:420px; color:var(--muted); font-size:17px; }
.text-column { max-width:650px; margin-left:33.33%; }
.text-column p { font:500 clamp(23px,3vw,41px)/1.12 var(--serif); letter-spacing:-.035em; }
.text-column p + p { margin-top:45px; font:15px/1.6 var(--sans); color:var(--muted); letter-spacing:0; }
.practice-list { margin-left:33.33%; border-top:1px solid var(--line); }
.practice-item { display:grid; grid-template-columns:80px 1fr; gap:24px; padding:32px 0 42px; border-bottom:1px solid var(--line); }
.practice-item h2 { margin:0 0 14px; font:500 clamp(32px,4.5vw,68px) var(--serif); }
.practice-item p { max-width:430px; color:var(--muted); }
.work-list { display:grid; grid-template-columns:1fr 1fr; gap:90px 30px; }
.work-list .project-card:nth-child(even) { padding-top:135px; }
.project-card .feature-image { height:42vw; max-height:620px; overflow:hidden; }
.project-card h2 { margin:17px 0 4px; font:500 31px var(--serif); }
.project-card p { color:var(--muted); margin:0; }
.contact-grid { display:grid; grid-template-columns:1fr 1fr; gap:7vw; }
.contact-grid h2 { margin:0; font:500 clamp(40px,5.7vw,82px) var(--serif); letter-spacing:-.05em; }
.contact-details { padding-top:10px; }
.contact-details p { margin-bottom:34px; }
.contact-details strong { display:block; font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:.12em; font-weight:500; margin-bottom:8px; }
.contact-details a:hover { color:var(--rust); }
.faq-list { margin-left:33.33%; border-top:1px solid var(--line); }
details { padding:23px 0; border-bottom:1px solid var(--line); }
summary { cursor:pointer; list-style:none; display:flex; justify-content:space-between; font:500 25px var(--serif); }
summary::-webkit-details-marker { display:none; }
details p { max-width:560px; color:var(--muted); margin:20px 40px 5px 0; }
.legal-copy { max-width:720px; margin-left:33.33%; }
.legal-copy h2 { margin-top:45px; font:500 33px var(--serif); }
.legal-copy p,.legal-copy li { color:var(--muted); }
.reveal { opacity:0; transform:translateY(18px); transition:.7s ease; }
.reveal.visible { opacity:1; transform:none; }
@media (min-width:721px) {
  .contact-page { height:100svh; overflow:hidden; }
  .contact-page .page-main { height:calc(100svh - 62px); min-height:0; padding-top:125px; padding-bottom:30px; display:flex; flex-direction:column; }
  .contact-page .page-title { padding-bottom:38px; }
  .contact-page .page-title h1 { font-size:clamp(46px,6vw,86px); }
  .contact-page .contact-grid { flex:1; align-items:start; }
  .contact-page .contact-grid h2 { font-size:clamp(34px,4.5vw,64px); }
  .contact-page .contact-details p { margin-bottom:18px; }
  .awards-page { height:100svh; overflow:hidden; }
  .awards-page .page-main { height:calc(100svh - 62px); min-height:0; padding-top:125px; padding-bottom:24px; }
  .awards-page .page-title { padding-bottom:28px; }
  .awards-page .page-title h1 { font-size:clamp(46px,6vw,86px); }
  .awards-page .page-lead { font-size:14px; }
  .awards-page .practice-item { grid-template-columns:55px 1fr; padding:13px 0 16px; gap:18px; }
  .awards-page .practice-item h2 { margin-bottom:3px; font-size:clamp(23px,2.5vw,36px); }
  .awards-page .practice-item p { margin-bottom:0; font-size:12px; line-height:1.35; }
}
@media (max-width:720px) {
  .back-link { left:20px; }
  .site-header { padding:24px 20px; grid-template-columns:1fr auto; }
  .header-center { display:none; }
  .menu-toggle { display:block; cursor:pointer; font-size:11px; text-transform:uppercase; letter-spacing:.1em; }
  .site-nav { position:fixed; inset:0; z-index:4; display:flex; flex-direction:column; justify-content:center; padding:30px 20px; background:var(--rust); color:var(--cream); transform:translateY(-100%); transition:.35s; font:500 38px var(--serif); text-transform:none; letter-spacing:0; }
  .site-nav.open { transform:none; }
  .hero { display:block; padding:125px 20px 20px; }
  .hero-copy { display:block; padding:0; }
  h1,.hero-copy > p:not(.eyebrow),.round-link { grid-column:auto; }
  h1 { font-size:18vw; }
  .hero-image { height:62vh; min-height:370px; margin-top:50px; border-radius:50% / 25%; }
  .band,.page-main { padding:78px 20px; }
  .intro,.page-title,.contact-grid { display:block; }
  .intro h2 { margin:50px 0 36px; font-size:12vw; }
  .stats { margin-top:60px; gap:12px; }
  .stats strong { font-size:10vw; }
  .stats span { font-size:8px; }
  .section-head { margin-bottom:35px; }
  .project-grid,.project-grid + .project-grid { display:block; margin-top:70px; }
  .project-grid + .project-grid .project:first-child,.project-grid + .project-grid .project:last-child { display:block; }
  .project-image { height:105vw; border-radius:50% / 25%; }
  .project-info { padding-top:18px; }
  .service-row { grid-template-columns:35px 1fr 20px; }
  .cta { display:block; }
  .cta h2 { margin:48px 0 70px; font-size:15vw; }
  .footer { display:block; line-height:2; }
  .footer span,.footer a { display:block; }
  .page-title h1 { margin-top:50px; font-size:18vw; }
  .contact-page .page-title h1 { font-size:15vw; }
  .work-page .page-title h1 { white-space:normal; font-size:18vw; }
  .feature-image { border-radius:50% / 25%; }
  .page-lead { margin-top:35px; }
  .text-column,.practice-list,.faq-list,.legal-copy { margin-left:0; }
  .work-list { display:block; }
  .work-list .project-card:nth-child(even) { padding-top:70px; }
  .project-card .feature-image { height:105vw; }
  .contact-grid h2 { margin-bottom:55px; font-size:14vw; }
}