:root {
  --bg: #eef2f4; /* Cool grey paper */
  --ink: #302c27; /* Soft printing ink */
  --accent: #874c3b; /* Brick pencil annotations */
  --muted: #686055; /* Secondary copy */
  --line: #aab8c0; /* Rules and form boundaries */
  --surface: #dde5e9; /* Inset paper */
  --sage: #d6dccb; /* Project accent */
  --white: #fbfdff; /* Proof sheets */
  --font-display: 'Castoro', Georgia, serif; /* Editorial headlines, regular and italic */
  --font-body: 'Commissioner', Arial, sans-serif; /* Clear body copy, 400 and 600 */
  --gutter: clamp(22px, 6.5vw, 120px); /* Generous outer margins */
  --space: clamp(64px, 8vw, 124px); /* Section breathing room */
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:24px}
body{margin:0;background:var(--bg);color:var(--ink);font:400 16px/1.65 var(--font-body);-webkit-font-smoothing:antialiased}
::selection{background:var(--sage);color:var(--ink)}
a{color:inherit;text-underline-offset:5px;text-decoration-thickness:1px}
a,button,summary{touch-action:manipulation}
:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
h1,h2,h3,p,figure{margin:0}
h1,h2,h3{font-family:var(--font-display);font-weight:400;letter-spacing:-.045em;line-height:1.1}
h1{font-size:clamp(46px,6.8vw,108px)}
h2{font-size:clamp(36px,4.2vw,66px)}
h3{font-size:clamp(27px,2.5vw,36px)}
p+p{margin-top:18px}
em{font-weight:400;color:var(--accent)}
img{display:block;width:100%;height:auto}
button,input,textarea,select{font:inherit}
button{cursor:pointer}
.wrap{max-width:1680px;margin-inline:auto;padding-inline:var(--gutter)}
.section{padding-block:var(--space)}
.rule{border-top:1px solid var(--line)}
.eyebrow{font-size:12px;letter-spacing:.12em;text-transform:uppercase;font-weight:600;line-height:1.5;color:var(--muted)}
.eyebrow .number{color:var(--accent);margin-right:24px}
.small{font-size:13px;color:var(--muted)}
.link{display:inline-flex;min-height:44px;align-items:center;gap:22px;color:var(--accent);font-weight:600}
.link .arrow{font-size:22px;transition:transform .2s}
.link:hover .arrow{transform:translateX(5px)}
.button{max-width:100%;display:inline-flex;min-height:52px;align-items:center;justify-content:space-between;gap:28px;background:var(--accent);color:var(--white);padding:13px 23px;text-decoration:none;font-weight:600;font-size:14px;border:1px solid var(--accent);transition:background .2s}
.button>span{flex:none}
.button:hover{background:var(--ink);border-color:var(--ink)}
.button:focus-visible{outline-color:var(--ink)}
.skip{position:fixed;z-index:20;top:12px;left:12px;background:var(--ink);color:var(--white);padding:12px 20px;transform:translateY(-170%)}
.skip:focus{transform:none}
.header{min-height:104px;display:flex;align-items:center;justify-content:space-between;gap:24px;border-bottom:1px solid var(--line)}
.wordmark{font:400 42px/1 var(--font-display);letter-spacing:-.065em;text-decoration:none;min-height:44px;display:flex;align-items:center;gap:6px}
.wordmark span{color:var(--accent)}
.desktop-nav{display:none}
.mobile-nav summary{cursor:pointer;min-height:44px;display:flex;align-items:center;gap:24px;font-size:14px;list-style:none}
.mobile-nav summary::-webkit-details-marker{display:none}
.mobile-nav summary::after{content:'+';color:var(--accent);font-size:25px}
.mobile-nav[open] summary::after{content:'−'}
.mobile-nav[open] nav{position:absolute;z-index:10;left:0;right:0;top:103px;padding:20px var(--gutter) 28px;background:var(--bg);border-bottom:1px solid var(--line);box-shadow:0 12px 15px #302c2710}
.mobile-nav nav a{display:flex;align-items:center;min-height:48px;text-decoration:none}
nav a[aria-current=page]{text-decoration:underline;text-decoration-color:var(--accent);text-underline-offset:7px}
.hero{padding-top:32px;padding-bottom:64px}
.hero-topline{display:flex;justify-content:space-between;gap:24px;margin-bottom:42px}
.hero-topline .location{display:none}
.hero-layout{display:grid;gap:44px}
.hero h1{max-width:11ch}
.hero h1 em{display:block}
.hero-intro{max-width:37ch;margin-top:28px;color:var(--muted)}
.hero .button{margin-top:28px}
.availability{display:flex;gap:10px;align-items:baseline;margin-top:20px;font-size:12px;color:var(--muted)}
.availability::before{content:'';width:6px;height:6px;flex:none;border-radius:50%;background:var(--accent)}
.hero-aside{padding:26px 0 0;border-top:1px solid var(--line)}
.hero-aside h2{font:600 12px/1.5 var(--font-body);letter-spacing:.1em;text-transform:uppercase;margin-bottom:12px}
.price-preview{margin:0}
.price-preview>div{display:flex;align-items:baseline;justify-content:space-between;gap:15px;border-bottom:1px solid var(--line);padding-block:15px}
.price-preview dt{font:400 20px/1.3 var(--font-display);letter-spacing:-.025em}
.price-preview dd{margin:0;white-space:nowrap;font-size:13px;font-variant-numeric:tabular-nums}
.hero-aside>.small{margin-top:15px}
.hero-aside .link{margin-top:10px;font-size:13px}
.section-top{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:22px;margin-bottom:38px}
.section-top h2{margin-top:14px}
.project-pair{display:grid;gap:36px}
.project-card{min-width:0}
.project-card:nth-child(2){margin-top:12px}
.frame{overflow:hidden;background:var(--surface);aspect-ratio:8/5}
.photo{height:100%;object-fit:cover;transition:transform .65s}
.project-image{display:block;position:relative;text-decoration:none}
.project-image::after{content:'↗';position:absolute;bottom:18px;right:18px;background:var(--bg);color:var(--ink);width:44px;height:44px;display:grid;place-items:center;transition:transform .2s}
.project-image:hover .photo{transform:scale(1.025)}
.project-image:hover::after{transform:translate(3px,-3px)}
.project-caption{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:19px}
.project-caption h3{font-size:29px}
.project-caption p{font-size:12px;color:var(--muted)}
.project-card>p{max-width:40ch;color:var(--muted);margin-top:8px;font-size:16px}
.proof-section{background:var(--surface);padding-block:var(--space)}
.proof-grid{display:grid;gap:38px}
.proof-copy>p:not(.eyebrow){margin-top:24px;max-width:36ch;color:var(--muted)}
.proof-copy h2{margin-top:16px}
.proof{background:var(--white);border:1px solid var(--line);padding:30px 25px;position:relative}
.proof .before{font:400 clamp(24px,3vw,36px)/1.35 var(--font-display);color:var(--muted);text-decoration:line-through;text-decoration-color:var(--accent);text-decoration-thickness:1px;max-width:21ch;margin:24px 0 30px}
.proof summary{list-style:none;min-height:44px;display:flex;align-items:center;gap:18px;cursor:pointer;font-size:13px;color:var(--accent);font-weight:600}
.proof summary::-webkit-details-marker{display:none}
.proof summary::before{content:'+';font-size:26px;font-weight:400}
.proof details[open] summary::before{content:'−'}
.proof .after{margin-top:24px;padding-top:26px;border-top:1px solid var(--line);font:400 clamp(26px,3vw,38px)/1.3 var(--font-display)}
.proof .after em{text-decoration:underline;text-underline-offset:8px;text-decoration-thickness:1px}
.proof .small{display:block;margin-top:20px}
.hire-grid{display:grid;gap:30px}
.hire-grid>div>p:last-child{margin-top:24px;max-width:28ch;color:var(--muted)}
.hire-grid h2{margin-top:18px}
.steps{list-style:none;margin:0;padding:0;counter-reset:step}
.steps li{counter-increment:step;position:relative;border-top:1px solid var(--line);padding:24px 0 24px 48px}
.steps li::before{content:'0' counter(step);position:absolute;top:28px;left:0;font-size:12px;color:var(--accent)}
.steps li:last-child{border-bottom:1px solid var(--line)}
.steps h3{font-size:27px;margin-bottom:10px}
.steps p{color:var(--muted);max-width:43ch}
.about-teaser{display:grid;gap:32px;align-items:center}
.portrait-frame{aspect-ratio:9/11;background:var(--surface)}
.about-teaser .portrait-frame{max-width:440px}
.about-teaser h2{margin-top:18px;max-width:12ch}
.about-teaser .body-copy{margin-top:24px;max-width:39ch;color:var(--muted)}
.about-teaser .link{margin-top:20px}
.faq-grid{display:grid;gap:30px}
.faq-grid h2{margin-top:18px}
.faq details{border-top:1px solid var(--line)}
.faq details:last-child{border-bottom:1px solid var(--line)}
.faq summary{min-height:68px;cursor:pointer;list-style:none;display:flex;gap:20px;align-items:center;justify-content:space-between;font-weight:600;font-size:16px;padding-block:18px}
.faq summary::-webkit-details-marker{display:none}
.faq summary::after{content:'+';color:var(--accent);font-size:23px;flex:none}
.faq details[open] summary::after{content:'−'}
.faq details p{padding:0 28px 26px 0;max-width:50ch;color:var(--muted)}
.end-cta{padding-block:64px;display:grid;gap:28px;align-items:center;border-top:1px solid var(--line)}
.end-cta h2{max-width:15ch}
.end-cta .eyebrow{margin-bottom:18px}
.end-cta .button{justify-self:start}
.footer{background:var(--ink);color:var(--bg);padding-top:48px;padding-bottom:26px}
.footer :focus-visible{outline-color:var(--sage)}
.footer-grid{display:grid;gap:28px}
.footer .wordmark{font-size:48px}
.footer .wordmark span{color:var(--sage)}
.footer p,.footer address{font-size:13px;line-height:1.7;font-style:normal;margin-top:14px}
.footer a{min-height:44px;display:inline-flex;align-items:center}
.footer .footer-cta{color:var(--sage);font-weight:600}
.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:16px;border-top:1px solid #777166;margin-top:32px;padding-top:14px;font-size:12px}
.page-intro{padding-top:32px;padding-bottom:56px}
.page-intro .eyebrow{margin-bottom:40px}
.page-intro h1{max-width:13ch}
.intro-bottom{display:grid;gap:24px;margin-top:28px;align-items:end}
.intro-bottom p{max-width:44ch;color:var(--muted)}
.intro-bottom .button{justify-self:start}
.services-list{padding-top:0}
.service-row{display:grid;grid-template-columns:28px minmax(0,1fr);gap:18px;border-top:1px solid var(--line);padding-block:36px}
.service-no{font-size:12px;color:var(--accent);padding-top:7px}
.service-row h2{font-size:clamp(33px,3.5vw,51px)}
.service-row .service-desc{color:var(--muted);margin-top:18px;max-width:35ch}
.service-detail{grid-column:2;max-width:38ch}
.service-detail ul{padding:0;list-style:none;margin:0 0 18px}
.service-detail li{padding:7px 0;border-bottom:1px solid var(--line);font-size:16px}
.service-price{grid-column:2}
.service-price strong{font:400 30px/1.25 var(--font-display);color:var(--accent);display:block}
.service-price .small{margin-top:8px}
.service-price .link{margin-top:16px;font-size:14px}
.scope-note{display:grid;gap:28px;background:var(--sage);padding:36px}
.scope-note h2{font-size:32px}
.scope-note p{max-width:53ch}
.work-index{padding-top:0}
.work-feature{display:grid;gap:26px;margin-bottom:72px}
.work-feature:last-child{margin-bottom:0}
.work-feature-copy h2{margin-top:15px}
.work-feature-copy>p:not(.eyebrow){margin-top:22px;max-width:32ch;color:var(--muted)}
.work-feature-copy .link{margin-top:18px}
.project-meta{display:flex;flex-wrap:wrap;gap:16px 30px;border-top:1px solid var(--line);padding-top:20px;margin-top:30px;font-size:12px;color:var(--muted)}
.case-crumb{font-size:12px;color:var(--muted);display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin-bottom:32px}
.case-crumb a{display:inline-flex;align-items:center;min-height:44px}
.case-header{padding-top:22px;padding-bottom:48px}
.case-header .eyebrow{margin-bottom:20px}
.case-header h1{max-width:14ch}
.case-header .intro-bottom{margin-top:24px}
.case-facts{display:grid;grid-template-columns:1fr 1fr;gap:22px;margin:30px 0 0;border-top:1px solid var(--line);padding-top:24px}
.case-facts dt{font-size:12px;color:var(--muted);margin-bottom:7px}
.case-facts dd{font-size:14px;margin:0}
.case-hero{margin-bottom:0}
.case-story{display:grid;gap:30px}
.case-story h2{margin-top:16px;max-width:13ch}
.case-story .reading{max-width:49ch}
.reading p{color:var(--muted)}
.reading .lead{font:400 clamp(24px,2.5vw,32px)/1.4 var(--font-display);color:var(--ink);letter-spacing:-.02em}
.case-excerpt{background:var(--sage);padding-block:var(--space)}
.case-excerpt .eyebrow{color:var(--ink)}
.excerpt-layout{display:grid;gap:30px}
.excerpt-layout h2{max-width:17ch;font-size:clamp(36px,5.5vw,78px)}
.excerpt-layout .reading{max-width:38ch}
.deliverables{display:grid;gap:30px}
.deliverables h2{margin-top:18px}
.deliverables ul{list-style:none;padding:0;margin:0}
.deliverables li{display:flex;gap:24px;padding:19px 0;border-top:1px solid var(--line);font-size:16px}
.deliverables li::before{content:'✓';color:var(--accent)}
.case-rebrand .case-excerpt{background:var(--surface)}
.case-quote{padding-block:var(--space);border-top:1px solid var(--line)}
.case-quote blockquote{margin:0;font:400 clamp(28px,4vw,54px)/1.25 var(--font-display);max-width:26ch;letter-spacing:-.025em}
.case-quote cite{display:block;font:400 13px/1.6 var(--font-body);margin-top:24px;font-style:normal;color:var(--muted)}
.related{display:flex;justify-content:space-between;align-items:center;gap:24px;padding-block:36px;border-top:1px solid var(--line)}
.related .link{font-family:var(--font-display);font-size:clamp(24px,3vw,36px);font-weight:400}
.about-opening{display:grid;gap:38px;padding-bottom:0}.page-intro:has(.about-opening){padding-bottom:0}
.about-opening .portrait-frame{max-width:540px}
.about-opening h1{max-width:10ch;margin-top:24px}
.about-opening .body-copy{max-width:40ch;margin-top:30px;color:var(--muted)}
.about-opening .button{margin-top:25px}
.caption{margin-top:14px;font-size:12px;color:var(--muted);display:flex;justify-content:space-between;gap:20px}
.values{display:grid;gap:36px}
.values h2{margin-top:18px;max-width:12ch}
.values dl{margin:0}
.values dl>div{border-top:1px solid var(--line);padding:24px 0}
.values dt{font:400 28px/1.2 var(--font-display);letter-spacing:-.025em;margin-bottom:13px}
.values dd{margin:0;max-width:44ch;color:var(--muted)}
.practice{display:grid;gap:30px;align-items:center;background:var(--surface);padding-block:var(--space)}
.practice .reading h2{margin-bottom:28px}
.contact-layout{display:grid;gap:44px;padding-top:32px;padding-bottom:var(--space)}
.contact-layout h1{max-width:11ch;margin-top:40px}
.contact-layout .body-copy{max-width:35ch;margin-top:28px;color:var(--muted)}
.contact-sheet{border:1px solid var(--line);background:var(--white);padding:30px 24px;align-self:start}
.contact-sheet h2{font-size:34px;margin:16px 0 24px}
.contact-sheet .button{margin-top:26px}
.contact-sheet ol{padding-left:19px;color:var(--muted);margin:24px 0 0}
.contact-sheet li{padding:4px 0;font-size:16px}
.contact-sheet>.small{margin-top:24px;border-top:1px solid var(--line);padding-top:20px}
.contact-details{margin-top:35px;border-top:1px solid var(--line);padding-top:20px}
.contact-details a{display:inline-flex;align-items:center;min-height:44px}
.contact-details p{margin:0;font-size:16px}
.contact-details address{font-size:14px;font-style:normal;margin-top:16px;color:var(--muted)}
.contact-form{display:grid;gap:12px}
.contact-form label{font-size:14px;font-weight:600;margin-top:12px}
.contact-form :is(input,textarea,select){width:100%;border:1px solid var(--muted);padding:13px;background:var(--white);color:var(--ink);border-radius:0;min-height:48px}
.contact-form textarea{resize:vertical;min-height:150px}
.contact-form .form-note{font-size:13px;color:var(--muted)}
.contact-form button{justify-self:start}
.legal-grid{display:grid;gap:38px;padding-top:0}
.legal-grid aside{font-size:13px;color:var(--muted)}
.legal-content{max-width:52ch}
.legal-content section{padding-bottom:32px}
.legal-content h2{font-size:30px;margin-bottom:18px}
.legal-content p{color:var(--muted)}
.error-layout{display:grid;gap:30px;padding-block:var(--space);align-items:center}
.error-mark{font:400 clamp(140px,28vw,310px)/1 var(--font-display);color:var(--accent);letter-spacing:-.07em;border-bottom:1px solid var(--line)}
.error-mark span{display:block;font-size:.3em;letter-spacing:0;margin:20px 0}
.error-layout h1{font-size:clamp(40px,5vw,76px);max-width:12ch}
.error-layout p{margin-top:24px;max-width:36ch;color:var(--muted)}
.error-layout .button{margin-top:28px}
@media(min-width:768px){
 .hero-layout{grid-template-columns:1.6fr 1fr;gap:8vw;align-items:end}.hero-aside{border-top:0;padding:0 0 8px}.hero-topline .location{display:block}.hero{padding-bottom:80px}.hero h1{font-size:clamp(58px,6.8vw,108px)}
 .project-pair{grid-template-columns:1.17fr 1fr;gap:6vw}.project-card:nth-child(2){margin-top:100px}
 .proof-grid{grid-template-columns:1fr 1.15fr;gap:8vw;align-items:center}.proof{padding:42px}
 .hire-grid{grid-template-columns:1fr 1.3fr;gap:9vw}.about-teaser{grid-template-columns:.85fr 1.15fr;gap:12vw}.about-teaser .portrait-frame{width:100%}
 .faq-grid{grid-template-columns:1fr 1.3fr;gap:9vw}.end-cta{grid-template-columns:1fr auto;padding-block:80px}
 .footer-grid{grid-template-columns:1.4fr 1fr 1fr;gap:6vw}
 .intro-bottom{grid-template-columns:1fr auto;gap:8vw}.service-row{grid-template-columns:28px 1.2fr 1fr;gap:28px}.service-detail{grid-column:3;grid-row:1}.service-price{grid-column:2}.scope-note{grid-template-columns:1fr 1.4fr;gap:6vw;padding:45px}
 .work-feature{grid-template-columns:1.7fr 1fr;gap:6vw;align-items:center}.work-feature.reverse{grid-template-columns:1fr 1.7fr}.work-feature.reverse .work-feature-copy{grid-row:1;grid-column:1}.work-feature.reverse figure{grid-column:2}
 .case-facts{grid-template-columns:repeat(4,1fr);gap:30px}.case-story{grid-template-columns:1fr 1.15fr;gap:10vw}.excerpt-layout{grid-template-columns:1.3fr 1fr;gap:10vw;align-items:center}.deliverables{grid-template-columns:1fr 1.15fr;gap:10vw}
 .about-opening{grid-template-columns:1.3fr 1fr;gap:9vw;align-items:center}.values{grid-template-columns:1fr 1.25fr;gap:9vw}.practice{grid-template-columns:1fr 1fr;gap:8vw}.contact-layout{grid-template-columns:1.2fr 1fr;gap:8vw}.contact-sheet{margin-top:40px;padding:38px}.legal-grid{grid-template-columns:1fr 2fr;gap:8vw}.error-layout{grid-template-columns:1fr 1.4fr;gap:10vw}
}
@media(min-width:1024px){
 .mobile-nav{display:none}.desktop-nav{display:flex;align-items:center;gap:32px;font-size:13px}.desktop-nav a{min-height:44px;display:flex;align-items:center;text-decoration:none}.desktop-nav a:hover{color:var(--accent)}.desktop-nav a[aria-current=page]{text-decoration:underline}.desktop-nav .button{min-height:46px;color:var(--white);font-size:13px;margin-left:10px}.hero-topline{margin-bottom:58px}.hero-intro{font-size:17px}.hero{padding-bottom:96px}.service-row{grid-template-columns:28px 1.25fr 1.1fr .75fr;gap:32px;padding-block:48px}.service-price{grid-column:4;grid-row:1}.page-intro{padding-bottom:76px}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}.project-image:hover .photo{transform:none}}

.contact-opening>.button{margin-top:24px}

.manuscript-frame{aspect-ratio:4/3}
.case-excerpt .reading p{color:#5a5249}
