@font-face { font-family:Newsreader; src:url('/fonts/newsreader-variable.woff2') format('woff2'); font-style:normal; font-weight:200 800; font-display:swap; }
@font-face { font-family:Manrope; src:url('/fonts/manrope-latin.woff2') format('woff2'); font-style:normal; font-weight:200 800; font-display:swap; }
:root { --canvas:#faf9f6; --paper:#f4f0e8; --ink:#182521; --rust:#99442c; --muted:#4f5c55; --graphite:#252824; --rule:#cdd1c9; --wash:#e8eae5; --display:Newsreader,Georgia,'Times New Roman',serif; --body:Manrope,Arial,sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:2rem; }
body { margin:0; color:var(--ink); background:var(--canvas); font-family:var(--body); font-size:1.125rem; line-height:1.65; -webkit-font-smoothing:antialiased; }
h1,h2,h3,p,figure { margin:0; }
h1,h2,h3 { text-wrap:balance; }
p { text-wrap:pretty; }
a { color:inherit; text-underline-offset:.22em; text-decoration-thickness:1px; }
a:hover { text-decoration-thickness:2px; }
button { font:inherit; }
button[hidden] { display:none; }
img { display:block; max-width:100%; height:auto; }
::selection { color:var(--paper); background:var(--rust); }
:focus-visible { outline:3px solid var(--rust); outline-offset:6px; border-radius:1px; }
main:focus { outline:none; }
.wrap { width:min(100% - 8rem,80rem); margin-inline:auto; }
.skip-link { position:fixed; left:1rem; top:-10rem; padding:.75rem 1rem; background:var(--ink); color:var(--paper); z-index:10; }
.skip-link:focus { top:1rem; }
.site-header { display:flex; align-items:center; justify-content:space-between; gap:2rem; padding-block:1.75rem 1.5rem; border-bottom:1px solid var(--rule); }
.wordmark { display:flex; align-items:center; min-height:44px; flex-shrink:0; }
.wordmark img { width:11rem; }
.site-header nav { display:flex; gap:2.5rem; flex-wrap:wrap; font-size:1rem; }
.site-header nav a { display:inline-flex; align-items:center; justify-content:center; gap:.35em; min-height:44px; min-width:44px; text-decoration:none; padding-block:.4rem; }
.site-header nav a:hover { color:var(--rust); text-decoration:underline; }
.eyebrow { font-size:.875rem; text-transform:uppercase; letter-spacing:.1em; font-weight:600; line-height:1.6; color:var(--rust); }
h2 { font-family:var(--display); font-weight:400; font-size:clamp(2.2rem,3.5vw,3.5rem); line-height:1.14; letter-spacing:-.02em; }
.text-link { display:inline-flex; align-items:center; min-height:44px; gap:.7rem; color:var(--rust); font-weight:600; padding-block:.4rem; }
.text-link span { font-size:1.2em; }
.hero { display:grid; grid-template-columns:minmax(0,.82fr) minmax(0,1.18fr); gap:3rem; align-items:start; padding-block:4rem; }
.hero-intro { padding-top:1.1rem; }
.hero h1 { font-family:var(--display); font-weight:400; font-size:clamp(3.1rem,4.7vw,4.6rem); line-height:1.06; letter-spacing:-.03em; max-width:13ch; }
.hero-lead { font-size:1.25rem; line-height:1.55; max-width:28rem; margin-top:1.65rem; }
.hero-intro .text-link { margin-top:1.3rem; }
.work-image img { width:100%; border:1px solid var(--graphite); }
figcaption { font-size:.875rem; color:var(--muted); line-height:1.55; margin-top:.65rem; }
.work-copy { padding-top:1.3rem; }
.project-kind { font-size:.875rem; color:var(--rust); }
.work-copy h2 { font-size:clamp(1.8rem,2.3vw,2.35rem); margin-top:.35rem; }
.work-copy > p:not(.project-kind) { font-size:1rem; color:var(--muted); margin-top:.6rem; }
.work-copy .text-link { font-size:1rem; margin-top:.6rem; }
.section { padding-block:3.75rem; }
.more-work { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:3rem; border-top:1px solid var(--rule); }
.about-section { padding-top:0; }
.about-section > .wrap { border-top:1px solid var(--rule); padding-top:3.75rem; }
.services { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4rem; margin-block:2rem 1.8rem; }
.services h3 { font-size:1.25rem; font-weight:600; line-height:1.4; margin-bottom:.6rem; }
.services p { color:var(--muted); max-width:32rem; }
.approach-line { max-width:56rem; }
.disclosure { max-width:57rem; margin-top:1.5rem; padding-top:1.5rem; border-top:1px solid var(--rule); font-size:.9375rem; color:var(--muted); }
.contact { background:var(--graphite); color:var(--paper); }
.contact-inner { padding-block:3.5rem 2.75rem; }
.contact-grid { display:grid; grid-template-columns:1.15fr 1fr; gap:5rem; }
.contact h2 { max-width:27rem; font-size:clamp(2.5rem,3.5vw,3.5rem); }
.contact-details { max-width:33rem; min-width:0; }
.contact-details > p:first-child { color:#dfdfd6; }
.contact :focus-visible { outline-color:#efb193; }
.email-address { display:flex; align-items:center; flex-wrap:wrap; gap:.3rem; width:fit-content; min-height:44px; padding-block:.5rem; margin-top:1.1rem; overflow-wrap:anywhere; font-size:1.25rem; }
.contact-utilities { display:flex; align-items:center; flex-wrap:wrap; gap:.25rem 1.25rem; margin-top:.4rem; }
.contact-help { color:#c6cec8; font-size:.875rem; }
.copy-button { display:inline-block; min-height:44px; border:none; border-bottom:1px solid #89968e; background:transparent; color:var(--paper); padding:.35rem 0; font-size:.875rem; cursor:pointer; }
.copy-button:hover { border-bottom-color:var(--paper); }
.copy-status { font-size:.875rem; }
.copy-status:not(:empty) { margin-top:.5rem; }
.site-footer { display:flex; align-items:center; flex-wrap:wrap; gap:1.5rem 3rem; padding-block:1.6rem; font-size:.875rem; color:var(--muted); }
.site-footer > p:first-child { display:flex; align-items:center; gap:1rem; }
.footer-name { font-family:var(--display); font-size:1.8rem; letter-spacing:-.04em; color:var(--ink); }
.footer-note { padding-left:1rem; border-left:1px solid var(--rule); }
.copyright { margin-left:auto; }
.site-footer a { display:inline-flex; align-items:center; min-height:44px; overflow-wrap:anywhere; }
.case-header { padding-block:2rem 2.5rem; }
.back-link { font-size:.875rem; margin-bottom:1.5rem; }
.case-header h1 { font-family:var(--display); font-size:clamp(3rem,5.1vw,4.75rem); font-weight:400; line-height:1.08; letter-spacing:-.03em; max-width:62rem; margin-bottom:1.25rem; }
.case-lead { font-size:1.25rem; max-width:49rem; }
.case-meta { display:flex; flex-wrap:wrap; gap:.4rem 1.5rem; list-style:none; margin:1.5rem 0 0; padding:0; color:var(--rust); font-size:.875rem; }
.case-status { font-size:.875rem; color:var(--muted); margin-top:.5rem; }
.case-cover img { width:100%; height:auto; border:1px solid var(--graphite); }
.case-cover figcaption a,.case-gallery figcaption a { display:flex; align-items:center; width:fit-content; min-height:44px; margin-top:.2rem; color:var(--rust); }
.case-story { padding-block:3.5rem; }
.case-story section { display:grid; grid-template-columns:1fr 2.3fr; gap:3rem; }
.case-story section + section { margin-top:2rem; padding-top:2rem; border-top:1px solid var(--rule); }
.case-story h2 { font-size:2rem; }
.case-story p { max-width:46rem; }
.case-context p { font-size:.9375rem; color:var(--muted); }
.case-context h2 { font-family:var(--body); font-size:1rem; font-weight:600; }
.case-gallery { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:2.5rem; }
.case-gallery .figure-wide { grid-column:1/-1; }
.case-gallery img { width:100%; height:44rem; padding:1.25rem; object-fit:contain; background:var(--wash); }
.case-gallery .figure-wide img { height:auto; }
.not-found { padding-block:5rem; }
.not-found h1 { font-family:var(--display); font-weight:400; font-size:clamp(3rem,6vw,5rem); line-height:1.1; margin-block:1rem 1.5rem; }
.not-found p { max-width:35rem; }
.not-found .text-link { margin-top:1.5rem; }
@media (max-width:62rem) {
  .wrap { width:min(100% - 4rem,80rem); }
  .hero { gap:2.5rem; }
  .hero h1 { font-size:clamp(2.75rem,5vw,3.6rem); }
  .contact-grid { gap:2.5rem; }
}
@media (max-width:44rem) {
  .wrap { width:calc(100% - 2.5rem); }
  .site-header { gap:1.25rem; flex-wrap:wrap; padding-block:1.3rem; }
  .wordmark img { width:8rem; }
  .site-header nav { gap:1.25rem; font-size:.875rem; }
  .hero { grid-template-columns:1fr; gap:2.5rem; padding-block:2.5rem; }
  .hero-intro { padding-top:0; }
  .hero h1 { font-size:clamp(2.75rem,10vw,3.25rem); max-width:13ch; }
  .hero-lead { font-size:1.125rem; margin-top:1.3rem; }
  .hero-intro .text-link { margin-top:1rem; }
  .section { padding-block:2.75rem; }
  .about-section { padding-top:0; }
  .about-section > .wrap { padding-top:2.75rem; }
  .more-work,.services,.contact-grid,.case-story section { grid-template-columns:1fr; }
  .services { gap:1.65rem; margin-block:1.65rem; }
  .disclosure { margin-top:1.25rem; padding-top:1.25rem; }
  .contact-inner { padding-block:2.75rem 2rem; }
  .contact-grid { gap:1.4rem; }
  .site-footer { align-items:start; flex-direction:column; gap:.35rem; padding-block:1.5rem; }
  .copyright { margin-left:0; }
  .case-header { padding-block:1.5rem 2rem; }
  .back-link { margin-bottom:1.5rem; }
  .case-header h1 { font-size:3rem; }
  .case-lead { font-size:1.125rem; }
  .case-story { padding-block:2.5rem; }
  .case-story section { gap:1rem; }
  .case-gallery { grid-template-columns:1fr; gap:1.5rem; }
  .case-gallery img { height:auto; padding:1rem; }
}
@media (max-width:24rem) {
  .site-header nav { justify-content:space-between; width:100%; }
  .case-header h1 { font-size:2.65rem; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } }