@import url('https://fonts.googleapis.com/css2?family=Bodoni+Moda:opsz,wght@6..96,400;6..96,500;6..96,700&family=Manrope:wght@400;500;600;700;800&family=Space+Mono:wght@400;700&display=swap');

:root { --ink:#173f35; --paper:#f3eee5; --muted:#a65f72; --line:rgba(23,63,53,.22); --heading:#8b2f4a; --acid:#d96c4f; --sun:#d9a441; --serif:'Instrument Serif', Georgia, serif; --sans:'DM Sans', 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:14px; line-height:1.45; }
a { color:inherit; text-decoration:none; }
.back-to-templates { position:fixed; z-index:20; top:12px; left:30px; font-family:var(--mono); font-size:9px; text-transform:uppercase; letter-spacing:.03em; border-bottom:1px solid currentColor; padding-bottom:3px; }
.site-header { position:absolute; z-index:5; top:0; left:0; width:100%; display:grid; grid-template-columns:1fr 1fr auto; align-items:start; padding:24px 30px; }
.wordmark { font-size:24px; font-weight:700; letter-spacing:-.06em; line-height:.84; color:var(--acid); }
.wordmark span { font-size:8px; vertical-align:top; margin-left:3px; letter-spacing:0; }
.header-note, .eyebrow, .section-count, .image-caption, .project-info p, .hero-stamp, .contact-top span, footer { font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.03em; }
.header-note { margin:0; color:var(--muted); line-height:1.25; }
.menu-toggle { display:none; background:none; border:0; font:inherit; padding:0; cursor:pointer; }
.site-nav { display:flex; gap:26px; font-size:12px; }
.site-nav a:hover, .site-nav a.active, .text-link:hover, .contact-link:hover { text-decoration:underline; text-underline-offset:4px; }
.site-nav a.active { text-decoration-thickness:2px; }
.hero { min-height:100svh; position:relative; padding:150px 30px 30px; display:flex; align-items:flex-end; overflow:hidden; }
.hero-copy { position:relative; z-index:1; width:54%; padding-bottom:3vw; }
.eyebrow { margin:0 0 22px; color:var(--muted); }
h1, h2, h3, p { margin-top:0; }
h1, h2, h3 { color:var(--heading); }
h1 { font-size:clamp(64px, 10.5vw, 166px); font-weight:400; letter-spacing:-.075em; line-height:.82; margin:0; max-width:900px; }
em { font-family:var(--serif); font-weight:400; letter-spacing:-.04em; }
.circle-link { width:70px; height:70px; border:1px solid var(--ink); border-radius:50%; display:grid; place-items:center; margin-top:58px; font-size:26px; transition:background .25s, color .25s; }
.circle-link:hover { background:var(--ink); color:var(--paper); }
.hero-image { position:absolute; right:30px; top:180px; width:38%; height:67%; z-index:1; }
.image-wrap { overflow:hidden; background:#d9a441; }
.image-wrap img { width:100%; height:100%; display:block; object-fit:cover; transition:transform .8s cubic-bezier(.2,.7,.2,1); }
.image-wrap:hover img { transform:scale(1.035); }
.image-caption { position:absolute; left:14px; bottom:13px; z-index:2; color:white; line-height:1.35; text-shadow:0 1px 12px #0008; }
.hero-stamp { position:absolute; top:108px; right:30px; z-index:3; color:var(--muted); text-align:right; line-height:1.3; }
.site-nav a { color:var(--muted); }
.site-nav a.active, .site-nav a:hover { color:var(--heading); }
.section-rule { border-top:1px solid var(--line); }
.statement { padding:140px 30px 150px; display:grid; grid-template-columns:1fr 2fr; gap:30px; }
.statement h2 { font-size:clamp(40px, 5vw, 78px); font-weight:400; letter-spacing:-.065em; line-height:.95; max-width:900px; margin:0; grid-column:2; }
.statement-meta { grid-column:2; display:grid; grid-template-columns:1fr 1.5fr; gap:30px; padding-top:76px; border-top:1px solid var(--line); margin-top:55px; }
.statement-meta span, .project-number, .service > span { font-family:var(--mono); font-size:11px; color:var(--muted); }
.statement-meta p { max-width:340px; margin:0; font-size:13px; }
.projects, .services { padding:45px 30px 140px; }
.section-heading, .contact-top { display:flex; justify-content:space-between; align-items:baseline; margin-bottom:60px; }
.section-heading .eyebrow, .contact-top .eyebrow { margin:0; }
.section-count { color:var(--muted); }
.project-image { position:relative; }
.project-number { position:absolute; top:15px; left:15px; color:white; }
.project-large { display:grid; grid-template-columns:2fr 1fr; gap:30px; align-items:end; margin-bottom:120px; }
.project-large .project-image { height:62vw; max-height:790px; }
.project-info { padding-bottom:8px; }
.project-info h3 { font-size:22px; font-weight:400; letter-spacing:-.05em; margin-bottom:6px; }
.project-info p { color:var(--muted); margin-bottom:37px; }
.text-link { font-family:var(--mono); text-transform:uppercase; font-size:10px; }
.text-link span, .contact-link span { font-size:16px; margin-left:6px; }
.project-grid { display:grid; grid-template-columns:1fr 1fr; gap:30px; margin-left:16%; margin-bottom:150px; }
.project-grid .project-image { height:48vw; max-height:630px; }
.project-wide { display:grid; grid-template-columns:1fr 1fr; gap:30px; align-items:end; }
.project-wide .project-image { height:38vw; max-height:510px; }
.services { padding-bottom:170px; }
.service-list { border-top:1px solid var(--line); }
.service { display:grid; grid-template-columns:1fr 3fr auto; align-items:center; min-height:120px; border-bottom:1px solid var(--line); transition:padding .35s, background .35s; }
.service h3 { font-size:clamp(32px, 4.4vw, 68px); letter-spacing:-.07em; font-weight:400; margin:0; }
.service i { font-family:var(--serif); font-size:32px; font-style:normal; padding-right:5px; }
.service:hover { padding:0 20px; background:var(--acid); }
.contact { background:var(--ink); color:var(--paper); min-height:100vh; padding:38px 30px 24px; display:flex; flex-direction:column; }
.contact .eyebrow, .contact-top span { color:var(--sun); }
.contact h2 { font-size:clamp(74px, 13.5vw, 220px); font-weight:400; letter-spacing:-.09em; line-height:.78; margin:auto 0 65px; }
.contact-link { font-size:clamp(26px, 4vw, 58px); letter-spacing:-.06em; padding-bottom:22px; border-bottom:1px solid rgba(243,238,229,.4); width:max-content; max-width:100%; }
.contact footer { margin-top:22px; color:var(--sun); display:flex; justify-content:space-between; }
.reveal { opacity:0; transform:translateY(25px); transition:opacity .8s ease, transform .8s ease; }
.reveal.is-visible { opacity:1; transform:none; }
.inner-page { min-height:100vh; }
.page-main { padding:170px 30px 100px; }
.page-intro { display:grid; grid-template-columns:1fr 2fr; gap:30px; padding-bottom:100px; }
.page-intro h1 { grid-column:2; font-size:clamp(70px, 11vw, 170px); }
.page-lead { grid-column:2; max-width:330px; margin:45px 0 0; font-size:18px; }
.page-projects { display:grid; grid-template-columns:1fr 1fr; gap:90px 30px; }
.page-project img { width:100%; height:42vw; max-height:620px; display:block; object-fit:cover; }
.page-project:nth-child(even) { padding-top:140px; }
.page-project h2 { font-size:30px; font-weight:400; letter-spacing:-.06em; margin:18px 0 4px; }
.page-project p, .small-note { font-family:var(--mono); color:var(--muted); font-size:10px; text-transform:uppercase; margin:0; }
.about-copy { margin-left:33.33%; max-width:550px; border-top:1px solid var(--line); padding-top:35px; }
.about-copy p { font-size:clamp(24px, 3vw, 44px); line-height:1.02; letter-spacing:-.055em; margin-bottom:38px; }
.light-link { display:inline-block; color:var(--ink); border-color:var(--ink); margin:45px 0 0 33.33%; }
.detail-list { margin-left:33.33%; border-top:1px solid var(--line); }
.detail-list section { display:grid; grid-template-columns:1fr 3fr; gap:20px; border-bottom:1px solid var(--line); padding:32px 0 38px; }
.detail-list section > span { font-family:var(--mono); color:var(--muted); font-size:11px; }
.detail-list h2 { font-size:clamp(34px, 5vw, 72px); line-height:.9; font-weight:400; letter-spacing:-.07em; margin:0 0 25px; }
.detail-list p { max-width:380px; margin:0; font-size:16px; }
.contact-page { background:var(--paper); }
.contact-page-main { padding-bottom:70px; }
.contact-layout { display:grid; grid-template-columns:0.9fr 1.5fr; gap:30px; margin:0 0 48px; }
.contact-card, .contact-form { background:rgba(255,255,255,.45); border:1px solid var(--line); box-shadow:0 18px 40px rgba(139,47,74,.06); padding:28px 24px; }
.contact-card h2 { font-size:clamp(26px, 3vw, 42px); letter-spacing:-.06em; line-height:1; font-weight:400; margin:0 0 20px; font-family:var(--serif); }
.contact-card address { display:grid; gap:16px; font-style:normal; margin:0; }
.contact-card a { display:block; color:var(--ink); }
.contact-card .small-note { margin-top:28px; }
.contact-form { display:grid; gap:22px; }
.form-row { display:grid; gap:8px; }
.form-row label { font-family:var(--mono); font-size:10px; text-transform:uppercase; letter-spacing:.08em; color:var(--muted); }
.form-row input, .form-row textarea { width:100%; border:1px solid rgba(139,47,74,.16); background:rgba(243,238,229,.9); padding:14px 16px; font:inherit; color:var(--ink); resize:vertical; border-radius:0; }
.form-row input:focus, .form-row textarea:focus { outline:2px solid rgba(217,108,79,.24); border-color:var(--acid); }
.contact-form button { width:max-content; border:1px solid var(--acid); background:var(--acid); color:#fff; font:inherit; padding:14px 20px; letter-spacing:.04em; text-transform:uppercase; cursor:pointer; transition:background .2s, color .2s, transform .2s; }
.contact-form button:hover { background:var(--ink); border-color:var(--ink); color:var(--paper); transform:translateY(-1px); }
.map-panel { border:1px solid rgba(139,47,74,.2); overflow:hidden; background:#ddd; height:380px; margin-bottom:50px; box-shadow:0 18px 48px rgba(139,47,74,.08); }
.map-panel iframe { width:100%; height:100%; border:0; display:block; }
.contact-details { margin-left:33.33%; max-width:530px; }
.contact-details > p:first-child { font-size:clamp(24px, 3vw, 44px); line-height:1.02; letter-spacing:-.055em; }
.contact-details .light-link { margin-left:0; }
.contact-details .small-note { margin-top:80px; line-height:1.6; color:var(--ink); }
.hero-copy h1, .statement h2, .project-info h3, .service h3, .page-intro h1, .detail-list h2, .contact-card h2 { color:var(--heading); }
.hero-copy h1 em, .statement h2 em, .contact h2 em, .page-intro h1 em, .detail-list h2 em { color:var(--acid); }
.project-info p, .page-project p, .small-note, .form-row label, .detail-list section > span { color:var(--muted); }
@media (max-width:700px) {
	.page-main { padding:125px 20px 70px; }
	.page-intro { display:block; padding-bottom:75px; }
	.page-intro h1 { font-size:20vw; margin-top:65px; }
	.page-lead { margin-top:35px; }
	.page-projects { display:block; }
	.page-project { margin-bottom:70px; }
	.page-project:nth-child(even) { padding-top:0; }
	.page-project img { height:110vw; }
	.page-project h2 { font-size:26px; }
	.about-copy, .detail-list, .contact-details { margin-left:0; }
	.about-copy p, .contact-details > p:first-child { font-size:9vw; }
	.light-link { margin-left:0; }
	.detail-list section { grid-template-columns:35px 1fr; }
	.detail-list h2 { font-size:11vw; }
	.contact-layout { grid-template-columns:1fr; }
	.map-panel { height:280px; }
}
@media (max-width:700px) { .site-header { padding:20px; grid-template-columns:1fr auto; } .header-note { display:none; } .menu-toggle { display:flex; align-items:center; gap:9px; position:relative; z-index:6; color:var(--ink); } .menu-icon { display:flex; flex-direction:column; gap:4px; } .menu-icon i { display:block; width:18px; border-top:1px solid currentColor; transition:transform .2s; } .site-nav { position:fixed; inset:0; background:var(--acid); color:var(--ink); display:flex; flex-direction:column; justify-content:center; padding:30px; gap:20px; transform:translateY(-100%); transition:transform .35s ease; font-size:38px; letter-spacing:-.06em; } .site-nav.is-open { transform:none; } .site-nav a { border-bottom:1px solid rgba(23,23,20,.25); padding-bottom:12px; } .hero { padding:140px 20px 20px; min-height:850px; display:block; } .hero-stamp { top:92px; right:20px; font-size:9px; } .hero-copy { width:100%; padding-top:35px; } h1 { font-size:20vw; } .circle-link { margin-top:30px; width:56px; height:56px; } .hero-image { position:absolute; left:20px; right:20px; top:auto; bottom:20px; width:auto; height:42%; } .statement { padding:90px 20px; display:block; } .statement h2 { margin-top:70px; font-size:13vw; } .statement-meta { margin-top:70px; padding-top:25px; grid-template-columns:1fr 2fr; gap:16px; } .projects, .services { padding:30px 20px 90px; } .section-heading { margin-bottom:35px; } .project-large, .project-wide { display:block; margin-bottom:90px; } .project-large .project-image, .project-wide .project-image { height:110vw; } .project-info { padding-top:18px; } .project-info p { margin-bottom:22px; } .project-grid { display:block; margin:0 0 90px; } .project-grid .project { margin-bottom:70px; } .project-grid .project-image { height:110vw; } .service { grid-template-columns:35px 1fr auto; min-height:90px; } .service h3 { font-size:10vw; } .service:hover { padding:0 8px; } .contact { padding:25px 20px 20px; min-height:720px; } .contact h2 { font-size:20vw; margin-bottom:55px; } .contact-link { font-size:7vw; } .contact footer { gap:10px; flex-wrap:wrap; } }