:root{color-scheme:dark;--bg:#081b16;--surface:#10261f;--raised:#152f26;--ink:#edf3ed;--muted:#aabcb2;--accent:#6ee089;--line:#294137;--button-ink:#092417;--sans:'DM Sans',sans-serif;--serif:'Cormorant Garamond',serif;--mono:'DM Mono',monospace;font-size:clamp(12.8px,1.0667vw,16px);scroll-behavior:smooth;scroll-padding-top:6rem;}

:root.light{color-scheme:light;--bg:#f2f6f1;--surface:#e5ece3;--raised:#dae5d8;--ink:#13271b;--muted:#516653;--accent:#146c34;--line:#ccd7cb;--button-ink:#fff;}
/* light --accent was #15803d: 4.17:1 on --surface and 3.86:1 on --raised, both AA
   fails for the small accent text (service tags, member initials). #146c34 clears
   every surface (5.0-6.0) and improves white-on-accent for buttons to 6.5:1. */

*{box-sizing:border-box;}
body,h1,h2,h3,p,figure,blockquote,dl,dd{margin:0;}
body{background:var(--bg);color:var(--ink);font-family:var(--sans);font-weight:400;-webkit-font-smoothing:antialiased;}
a{color:inherit;text-decoration:none;}
button{font:inherit;cursor:pointer;}
img{display:block;max-width:100%;height:auto;}
button,a,summary{-webkit-tap-highlight-color:transparent;}
a:focus-visible,button:focus-visible,summary:focus-visible{outline:2px solid var(--accent);outline-offset:6px;}
[hidden]{display:none!important;}
::selection{background:var(--accent);color:var(--button-ink);}
.container{width:min(100% - 8rem,80rem);margin-inline:auto;}
.section{padding-block:7.5rem;}
h2{font-size:clamp(2.8rem,4.5vw,4.4rem);font-weight:500;line-height:1.08;letter-spacing:-.055em;}
h2 em{font-family:var(--serif);font-weight:400;letter-spacing:-.025em;}
h3{font-weight:500;letter-spacing:-.03em;}
.eyebrow{font-family:var(--mono);font-size:max(.75rem,12px);letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin-bottom:2rem;}
.section-heading{margin-bottom:3.75rem;}
.skip{position:fixed;left:1rem;top:-5rem;z-index:20;padding:1rem;background:var(--ink);color:var(--bg);}
.skip:focus{top:1rem;}
.header{position:sticky;top:0;z-index:10;background:var(--bg);border-bottom:1px solid var(--line);}
.nav{display:flex;align-items:center;justify-content:space-between;height:5.2rem;gap:2rem;}
/* Mark + hairline + wordmark. The ampersand rule is scoped to .amp so the mark and
   the rule don't inherit the serif; .wm-mark is sized in em so it tracks the
   responsive font-size step on its own. */
.wordmark{display:inline-flex;align-items:center;gap:.34em;font-size:1.9rem;font-weight:600;letter-spacing:-.065em;white-space:nowrap;}
.wordmark .amp{font-family:var(--serif);font-weight:500;}
.wm-mark{flex:0 0 auto;height:.9em;width:auto;}
.wm-rule{flex:0 0 auto;width:1px;height:.62em;background:var(--line);}
.desktop-nav{display:flex;align-items:center;gap:2.6rem;margin-left:auto;margin-right:3rem;font-size:.95rem;}
.desktop-nav a{padding-block:1rem;color:var(--muted);transition:color .2s;}
.desktop-nav a:hover{color:var(--ink);}
.nav-actions{display:flex;gap:1.25rem;align-items:center;}
.button{display:inline-flex;align-items:center;justify-content:center;gap:2.25rem;min-height:3.5rem;padding:.9rem 1.7rem;border-radius:3rem;background:var(--accent);color:var(--button-ink);font-size:.9375rem;font-weight:500;white-space:nowrap;transition:transform .25s,background .25s;}
.button:hover{transform:translateY(-3px);}
.button:active{transform:translateY(0);}
.button span{font-size:1.35rem;line-height:1;}
.button--small{min-height:2.8rem;padding:.65rem 1.35rem;gap:1.8rem;}
.button--white{background:var(--ink);color:var(--bg);}
.theme-toggle{width:2.75rem;height:2.75rem;border:0;background:transparent;color:var(--ink);font-size:1.5rem;border-radius:50%;}
.menu-toggle{display:none;}
.mobile-nav{padding:1rem 1.5rem 2rem;}
.mobile-nav a{display:block;font-size:1.5rem;padding:1rem 0;border-bottom:1px solid var(--line);}
/* Height has to grow with width or the art box gets wider than the render is
   shaped, and background-size:cover crops the sculpture top and bottom — 237px of it
   at 1754px wide. The vh cap stops a wide-but-short screen pushing .proof off. */
.hero{position:relative;isolation:isolate;overflow:hidden;min-height:min(clamp(43rem,50vw,58rem),92vh);display:flex;align-items:center;background:#081b16;}
.hero-art{position:absolute;z-index:-1;inset:0 0 0 21%;background:center/cover no-repeat;background-image:url(../assets/ampersand.webp);}
@media(max-width:680px){.hero-art{background-image:url(../assets/ampersand-768.webp);}}
html.light .hero-art{background-image:url(../assets/ampersand-light.webp);}
@media(max-width:680px){html.light .hero-art{background-image:url(../assets/ampersand-light-768.webp);}}
.hero-art::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,#081b16 0%,rgba(8,27,22,.92) 7%,transparent 40%),linear-gradient(0deg,#081b16 0%,transparent 12%);}
.hero-content{padding-block:4rem 5rem;}
.hero-eyebrow{color:#b2c8ba;margin-bottom:2.5rem;}
.hero h1{font-size:clamp(5rem,8.4vw,8rem);line-height:.99;font-weight:500;letter-spacing:-.075em;color:#edf3ed;max-width:48rem;}
.hero h1>span{display:block;}
.hero h1 em{font-family:var(--serif);font-weight:400;letter-spacing:-.055em;color:#a6dbb2;display:inline-block;min-width:3.4em;line-height:1.12;}
/* The typewriter empties this element between words. An empty inline-block generates
   no line box, so it collapses and drags the headline with it. A zero-width space in
   a pseudo-element keeps the box honest and never touches textContent. */
.hero h1 em::before{content:"​";}
.hero-description{margin-top:2.25rem;max-width:32rem;font-size:1.125rem;line-height:1.7;color:#becbc2;}
.hero-actions{display:flex;align-items:center;gap:2rem;margin-top:2.4rem;}
.hero .button{background:#6ee089;color:#092417;}
.text-link{display:inline-flex;align-items:center;gap:1.1rem;font-size:.9375rem;min-height:2.75rem;padding-block:.5rem;border-bottom:1px solid var(--line);transition:gap .25s;}
.text-link:hover{gap:1.5rem;}
.hero .text-link{color:#edf3ed;border-color:#496153;}
.proof{display:flex;align-items:center;justify-content:space-between;gap:3rem;padding-block:2.7rem;border-bottom:1px solid var(--line);}
.proof>p{font-size:1.125rem;line-height:1.5;}
.proof>p>span{color:var(--muted);}
.proof dl{display:flex;gap:5.75rem;}
.proof dl>div{display:flex;align-items:center;gap:1.15rem;flex-direction:row-reverse;}
.proof dd{font-size:3rem;font-weight:400;letter-spacing:-.065em;line-height:1;}
.proof dt{font-size:.875rem;color:var(--muted);max-width:5.75rem;line-height:1.5;}
.project-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:4rem 2rem;}
.project{grid-column:span 7;min-width:0;}
.project:nth-child(2),.project:nth-child(3){grid-column:span 5;}
.project:nth-child(2){padding-top:7rem;}
.project:nth-child(3){padding-top:3rem;}
.project-visual{display:block;border-radius:.55rem;}
.project-frame{display:block;position:relative;overflow:hidden;border-radius:.55rem;border:1px solid var(--line);background:var(--surface);}
.project-visual img{width:100%;transition:transform .6s cubic-bezier(.22,1,.36,1);}
.project-open{display:grid;place-items:center;flex:0 0 auto;width:2.75rem;height:2.75rem;border:1px solid var(--line);border-radius:50%;color:var(--ink);font-size:1.3rem;transition:background .25s,color .25s,border-color .25s;}
.project-visual:focus-visible .project-open{background:var(--accent);border-color:var(--accent);color:var(--button-ink);}
@media(hover:hover){.project-visual:hover img{transform:scale(1.025);}
.project-visual:hover .project-open{background:var(--accent);border-color:var(--accent);color:var(--button-ink);}}
.project-meta{display:flex;justify-content:space-between;flex-wrap:wrap;gap:.5rem 1rem;margin-top:1.5rem;}
.project-caption{display:flex;justify-content:space-between;align-items:center;gap:1rem;margin-top:.55rem;}
.project-category{font-size:max(.75rem,12px);color:var(--muted);margin-bottom:.6rem;}
.project-meta .project-category{margin:0;}
.project-caption h3{font-size:1.75rem;line-height:1.15;}
.project-region{font-size:max(.75rem,12px);color:var(--muted);white-space:nowrap;}
.project-description{margin-top:.5rem;font-size:.9375rem;line-height:1.65;color:var(--muted);max-width:33rem;padding-right:3.75rem;}
.more-work{margin-top:4rem;border-top:1px solid var(--line);border-bottom:1px solid var(--line);}
.more-work>summary{font-size:1.15rem;padding:1.6rem 0;display:flex;justify-content:space-between;gap:1rem;}
.more-work>summary>span{font-size:1.5rem;font-weight:400;}
summary{cursor:pointer;list-style:none;}
summary::-webkit-details-marker{display:none;}
.engagement-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:3rem;padding:1rem 0 3rem;}
.engagement h3{font-size:1.35rem;margin-bottom:.7rem;}
.engagement>p:last-child{font-size:.9375rem;color:var(--muted);line-height:1.7;}
.services{background:var(--surface);border-radius:1.5rem;margin-inline:1.5rem;}
.services-layout{display:grid;grid-template-columns:1fr 1.3fr;gap:7rem;}
.services-heading>p:not(.eyebrow){font-size:1.125rem;line-height:1.75;color:var(--muted);max-width:24rem;margin:2rem 0 1.5rem;}
.service-list>details{border-bottom:1px solid var(--line);}
.service-list>details:first-child{border-top:1px solid var(--line);}
.service-list summary{display:grid;grid-template-columns:1.5rem 1fr 1.5rem;gap:1rem;align-items:center;padding:2rem 0;}
.service-number{font-family:var(--mono);font-size:max(.75rem,12px);color:var(--muted);}
.service-list h3{font-size:1.8rem;}
.plus{font-size:1.5rem;font-weight:400;transition:transform .25s;}
.service-list details[open] .plus{transform:rotate(45deg);}
.service-body{padding:0 2.5rem 2rem;}
.service-body p{font-size:1rem;line-height:1.75;color:var(--muted);}
.service-body .service-tags{margin-top:1.25rem;font-size:max(.75rem,12px);color:var(--accent);line-height:1.8;}
.steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));list-style:none;padding:0;margin:0;gap:2.5rem;}
.steps li{padding-top:1.5rem;border-top:1px solid var(--line);}
.steps li>span{font-family:var(--mono);font-size:max(.75rem,12px);color:var(--accent);}
.steps h3{font-size:1.6rem;margin:1.5rem 0 1rem;}
.steps p{font-size:1rem;line-height:1.7;color:var(--muted);max-width:17rem;}
.testimonials{background:var(--surface);}
.testimonial-layout{display:grid;grid-template-columns:1fr 1.5fr;gap:7rem;}
.testimonial-heading>p:not(.eyebrow){font-size:1.25rem;color:var(--muted);line-height:1.55;}
.quote-controls{display:flex;flex-direction:column;align-items:start;gap:.75rem;margin-top:2.5rem;}
.quote-tab{background:none;border:1px solid var(--line);border-radius:3rem;padding:.65rem 1.15rem;font-size:.875rem;color:var(--muted);min-height:2.75rem;transition:background .2s,color .2s,border-color .2s;}
.quote-tab.active{background:var(--ink);border-color:var(--ink);color:var(--bg);}
.quote-tab:hover:not(.active){border-color:var(--muted);color:var(--ink);}
.quote-excerpt{font-family:var(--serif);font-size:3.65rem;line-height:1.12;letter-spacing:-.025em;max-width:38rem;}
.quote-panel figcaption{display:flex;gap:1rem;align-items:center;margin-top:2rem;}
.quote-panel figcaption img{width:3rem;height:3rem;object-fit:contain;background:#fff;padding:.25rem;border-radius:50%;}
.quote-panel figcaption b{font-size:.9375rem;font-weight:500;display:block;}
.quote-panel figcaption span{font-size:max(.75rem,12px);color:var(--muted);display:block;margin-top:.4rem;}
.full-quote{margin-top:2rem;}
.full-quote summary{font-size:max(.8125rem,13px);color:var(--muted);display:flex;gap:1rem;min-height:2.75rem;align-items:center;}
.full-quote blockquote{font-size:1rem;line-height:1.8;color:var(--muted);margin-top:1rem;max-width:39rem;}
.studio-layout{display:grid;grid-template-columns:1fr 1fr;gap:8rem;}
.studio-copy>p{font-size:1.2rem;line-height:1.8;max-width:34rem;}
.studio-copy>p+p{font-size:1rem;color:var(--muted);margin-top:1.5rem;}
.studio-copy .text-link{margin-top:1.5rem;}
/* Initials stand in until real portraits arrive — the circle is sized so a photo
   drops straight in without the layout moving. Names float; no rules between them. */
.team{display:grid;gap:2.25rem;align-content:start;}
.member{display:flex;align-items:center;gap:1.25rem;}
.member-avatar{flex:0 0 auto;display:grid;place-items:center;width:4rem;height:4rem;border-radius:50%;background:var(--surface);border:1px solid var(--line);font-family:var(--sans);font-size:1.25rem;font-weight:500;letter-spacing:.04em;color:var(--accent);}
.team h3{font-size:1.4rem;margin-bottom:.4rem;}
.team p{font-size:max(.8125rem,13px);color:var(--muted);}
.faq{display:grid;grid-template-columns:1fr 1.5fr;gap:7rem;border-top:1px solid var(--line);}
.faq-list details{border-bottom:1px solid var(--line);}
.faq-list summary{display:flex;justify-content:space-between;gap:1.5rem;padding:1.75rem 0;font-size:1.125rem;}
.faq-list details:first-child summary{padding-top:0;}
.faq-list summary span{font-size:1.5rem;line-height:1;}
.faq-list details p{font-size:1rem;line-height:1.8;color:var(--muted);padding:0 2rem 1.5rem 0;}
.contact{background:var(--raised);border-radius:1.5rem;margin-inline:1.5rem;}
.contact h2{font-size:clamp(4.5rem,7.5vw,7rem);max-width:70rem;line-height:1.03;}
.contact h2 em{color:var(--accent);}
.contact-bottom{display:grid;grid-template-columns:1fr 1fr;align-items:start;gap:4rem;margin-top:3rem;}
.contact-bottom p{font-size:1.125rem;line-height:1.65;color:var(--muted);}
.contact-invite .button{margin-top:2rem;}
/* The second path out of this section — kept as visible as the booking button,
   in the same hairline rows the team and question lists use. */
.contact-direct .eyebrow{margin-bottom:1rem;}
.contact-direct ul{list-style:none;margin:0;padding:0;border-top:1px solid var(--line);}
.contact-direct li{border-bottom:1px solid var(--line);}
.contact-direct a{display:flex;align-items:center;justify-content:space-between;gap:1rem;min-height:2.75rem;padding:1.1rem 0;font-size:1.0625rem;transition:color .2s;}
.contact-direct a:hover{color:var(--accent);}
.contact-direct a span{font-size:1.1rem;line-height:1;}
.contact-details{margin-top:3rem;padding-top:2rem;border-top:1px solid var(--line);font-size:.875rem;color:var(--muted);}
.footer{padding-top:6rem;}
.footer-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:3rem;padding-bottom:3.5rem;border-bottom:1px solid var(--line);}
.footer-col .eyebrow{margin-bottom:1.25rem;}
.footer-col ul{list-style:none;margin:0;padding:0;}
.footer-col a{display:inline-flex;align-items:center;gap:.6rem;min-height:2.75rem;padding-block:.5rem;font-size:.9375rem;color:var(--muted);transition:color .2s;}
.footer-col a:hover{color:var(--ink);}
.footer-col a span{font-size:1.05rem;line-height:1;}
.footer-wordmark{display:block;font-size:clamp(2.4rem,8vw,6rem);font-weight:600;letter-spacing:-.04em;line-height:1;white-space:nowrap;margin-top:3.5rem;}
.footer-wordmark>span{font-family:var(--serif);font-weight:400;color:var(--accent);}
.footer-bottom{display:flex;align-items:center;justify-content:space-between;gap:2rem;border-top:1px solid var(--line);padding:2rem 0;margin-top:2rem;font-size:max(.75rem,12px);color:var(--muted);}
.footer-top{display:inline-flex;align-items:center;gap:.6rem;min-height:2.75rem;transition:color .2s;}
.footer-top:hover{color:var(--ink);}
.footer-top span{font-size:1.05rem;line-height:1;}

html.light .hero{background:#e5ece3;}
html.light .hero-art::after{background:linear-gradient(90deg,#e5ece3 0%,rgba(229,236,227,.8) 7%,transparent 40%),linear-gradient(0deg,#e5ece3 0%,transparent 12%);}
html.light .hero h1{color:#13271b;}
html.light .hero h1 em{color:#15803d;}
html.light .hero-description,html.light .hero-eyebrow{color:#425847;}
html.light .hero .text-link{color:#13271b;border-color:#bacaba;}

@media(min-width:681px) and (max-width:1100px){.container{width:calc(100% - 5rem);}
.hero{min-height:45rem;}
.hero h1{font-size:6.25rem;}
.hero-art{left:15%;}
.hero-art::after{background:linear-gradient(90deg,#081b16 0%,rgba(8,27,22,.7) 25%,transparent 70%),linear-gradient(0deg,#081b16,transparent 20%);}
.proof dl{gap:3rem;}
.services-layout,.testimonial-layout,.studio-layout,.faq{gap:3.5rem;}
.services-layout{grid-template-columns:1fr 1.2fr;}
.service-list h3{font-size:1.65rem;}
.project-region{display:none;}
.desktop-nav{margin-right:1rem;gap:2rem;}
.steps{gap:2rem;}
.quote-excerpt{font-size:3.2rem;}
.hero-description,.proof>p,.steps p,.studio-copy>p+p,.full-quote blockquote,.faq-list details p,.service-body p{font-size:1.25rem;}
.project-description,.text-link,.button,.desktop-nav{font-size:1.0625rem;}
.theme-toggle,.button--small{min-height:3.4375rem;}
.project-category,.project-region,.eyebrow,.team p,.contact-details,.quote-tab,.service-body .service-tags,.footer-bottom{font-size:.9375rem;}
.services-heading>p:not(.eyebrow){font-size:1.25rem;}
.contact-details span{margin-left:0;}
.project-caption h3{font-size:1.7rem;}
}

@media(max-width:680px){:root{font-size:16px;scroll-padding-top:5.25rem;}
.container{width:calc(100% - 2.5rem);}
.section{padding-block:4.5rem;}
.nav{height:4.5rem;gap:1rem;}
.wordmark{font-size:1.65rem;}
.desktop-nav{display:none;}
.nav-actions{gap:.35rem;}
.nav-actions>.button{display:none;}
.theme-toggle{font-size:1.4rem;}
.menu-toggle{display:flex;flex-direction:column;justify-content:center;gap:6px;width:2.75rem;height:2.75rem;border:0;background:transparent;padding:.65rem;}
.menu-toggle span{height:1px;width:100%;background:var(--ink);transition:transform .2s;}
.menu-toggle[aria-expanded=true] span:first-child{transform:translateY(3.5px) rotate(45deg);}
.menu-toggle[aria-expanded=true] span:last-child{transform:translateY(-3.5px) rotate(-45deg);}
.hero{min-height:0;display:block;}
.hero-content{padding-top:3.2rem;padding-bottom:19rem;}
.hero-eyebrow{font-size:.6875rem;letter-spacing:.1em;margin-bottom:1.5rem;}
.hero h1{font-size:clamp(2.5rem,12.8vw,5.8rem);letter-spacing:-.07em;line-height:1.03;}
.hero-description{font-size:.9375rem;line-height:1.75;margin-top:1.5rem;}
.hero-description br{display:none;}
.hero-actions{gap:1.25rem;align-items:start;flex-direction:column;margin-top:1.75rem;}
.hero-actions .text-link{position:absolute;bottom:1.2rem;left:1.25rem;z-index:2;font-size:.8125rem;}
.button{min-height:3.1rem;font-size:.875rem;padding:.85rem 1.3rem;gap:1.8rem;}
.hero-art{inset:auto 0 0 0;height:21rem;}
.hero-art img{object-fit:cover;object-position:center;}
.hero-art::after{background:linear-gradient(180deg,#081b16 0%,rgba(8,27,22,.85) 12%,transparent 36%),linear-gradient(0deg,#081b16 0%,transparent 20%);}
.proof{padding-block:2rem;display:block;}
.proof>p{font-size:.875rem;margin-bottom:1.5rem;}
.proof>p br{display:none;}
.proof>p span{margin-left:.25rem;}
.proof dl{justify-content:space-between;gap:1rem;}
.proof dl>div{display:flex;flex-direction:column-reverse;align-items:start;gap:.5rem;}
.proof dd{font-size:2.5rem;}
.proof dt{font-size:.6875rem;max-width:6rem;}
.eyebrow{font-size:.6875rem;margin-bottom:1.4rem;}
h2{font-size:2.6rem;line-height:1.1;}
.section-heading{margin-bottom:2.5rem;}
.project-grid{grid-template-columns:1fr;gap:2.7rem;}
.project,.project:nth-child(2),.project:nth-child(3){grid-column:auto;padding-top:0;}
.project-meta{margin-top:1.1rem;}
.project-caption{margin-top:.4rem;gap:.75rem;}
.project-caption h3{font-size:1.45rem;}
.project-category{font-size:.6875rem;}
.project-region{font-size:.6875rem;}
.project-description{font-size:.875rem;}
.project-open{font-size:1.25rem;}
.more-work{margin-top:2.5rem;}
.more-work>summary{font-size:1rem;}
.engagement-grid{grid-template-columns:1fr;gap:2rem;}
.services,.contact{margin-inline:.5rem;border-radius:1rem;}
.services .container,.contact .container{width:calc(100% - 2rem);}
.services-layout,.testimonial-layout,.studio-layout,.faq{grid-template-columns:1fr;gap:2.5rem;}
.services-heading>p:not(.eyebrow){font-size:1rem;margin-top:1.5rem;}
.service-list summary{padding:1.5rem 0;grid-template-columns:1.25rem 1fr 1.25rem;gap:.5rem;}
.service-list h3{font-size:1.35rem;}
.service-number{font-size:.6875rem;}
.service-body{padding:0 1.75rem 1.5rem;}
.service-body p{font-size:.9375rem;}
.service-body .service-tags{font-size:.6875rem;}
.steps{grid-template-columns:1fr 1fr;gap:2.5rem 1.5rem;}
.steps h3{font-size:1.4rem;margin-top:1rem;}
.steps p{font-size:.875rem;}
.steps li>span{font-size:.6875rem;}
.testimonial-heading>p:not(.eyebrow){font-size:1.1rem;}
.quote-controls{flex-direction:row;flex-wrap:wrap;gap:.8rem;margin-top:1.5rem;}
.quote-tab{font-size:.75rem;padding:.65rem 1rem;}
.quote-excerpt{font-size:2.65rem;}
.quote-panel figcaption{margin-top:1.5rem;}
.quote-panel figcaption b{font-size:.875rem;}
.quote-panel figcaption span{font-size:.6875rem;}
.full-quote blockquote{font-size:.9375rem;}
.studio-copy>p{font-size:1.1rem;}
.studio-copy>p+p{font-size:.9375rem;}
.team h3{font-size:1.25rem;}
.team p{font-size:.75rem;}
.faq .section-heading{margin-bottom:0;}
.faq-list summary{font-size:1rem;line-height:1.5;}
.faq-list details p{font-size:.9375rem;padding-right:0;}
.contact h2{font-size:clamp(3rem,11.8vw,4.8rem);}
.contact-bottom{grid-template-columns:1fr;gap:2.5rem;margin-top:2rem;}
.contact-direct a{font-size:.9375rem;padding:.9rem 0;}
.contact-bottom p{font-size:1rem;}
.contact-bottom .button{margin-top:1.7rem;}
.contact-details{flex-direction:column;gap:1rem;margin-top:2rem;padding-top:1.5rem;font-size:.8125rem;}
.contact-details span{font-size:.6875rem;margin-left:0;line-height:1.6;}
.footer{padding-top:3rem;}
.footer-bottom{display:flex;flex-direction:column;gap:1rem;margin-top:2rem;padding-block:1.5rem;font-size:.6875rem;}
.text-link{font-size:.875rem;}
html.light .hero-art::after{background:linear-gradient(180deg,#e5ece3 0%,rgba(229,236,227,.85) 12%,transparent 36%),linear-gradient(0deg,#e5ece3 0%,transparent 20%);}
}

@media(prefers-reduced-motion:no-preference){.hero-content{animation:enter .85s both;}
.hero-art{animation:art-enter 1.4s both;}
.js .reveal{opacity:0;transform:translateY(1.2rem);transition:opacity .75s,transform .75s cubic-bezier(.22,1,.36,1);}
.js .reveal.visible{opacity:1;transform:none;}
@keyframes enter{from{opacity:0;transform:translateY(1rem);}
to{opacity:1;transform:none;}
}
@keyframes art-enter{from{opacity:0;transform:scale(1.04);}
to{transform:scale(1);}
}
}

@media(prefers-reduced-motion:reduce){:root{scroll-behavior:auto;}
*,*::before,*::after{animation:none!important;transition:none!important;}
}
/* Navigation and project viewing */
:root{scrollbar-gutter:stable;}
.desktop-nav a{position:relative;}
.desktop-nav a::after{content:'';position:absolute;left:0;right:0;bottom:.5rem;height:1px;background:var(--accent);transform:scaleX(0);transform-origin:left;transition:transform .25s;}
.desktop-nav a[aria-current]{color:var(--ink);}
.desktop-nav a[aria-current]::after{transform:scaleX(1);}
.mobile-nav a[aria-current]{color:var(--accent);}
.service-list summary:hover h3,.faq-list summary:hover{color:var(--accent);}
.service-list h3,.faq-list summary{transition:color .2s;}
.more-work[open]>summary>span,.full-quote[open]>summary>span,.faq-list details[open]>summary>span{transform:rotate(45deg);}
.more-work>summary>span,.full-quote>summary>span,.faq-list summary>span{display:inline-block;transition:transform .2s;}
.project-dialog{width:min(calc(100% - 3rem),76rem);max-height:calc(100dvh - 3rem);margin:auto;padding:0;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:1.1rem;overscroll-behavior:contain;}
.project-dialog::backdrop{background:rgba(2,12,8,.78);backdrop-filter:blur(6px);}
:root:has(.project-dialog[open]){overflow:hidden;}
.preview-toolbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 2rem;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);z-index:1;}
.preview-toolbar>p{font-size:.875rem;color:var(--muted);}
#preview-count{margin-left:1.5rem;font-family:var(--mono);font-size:max(.75rem,12px);}
.preview-close{display:flex;align-items:center;gap:1.5rem;min-height:2.75rem;background:none;border:0;padding:.5rem 0 .5rem 1rem;color:var(--ink);font-size:.875rem;}
.preview-close span{font-size:1.75rem;line-height:1;}
.preview-content{display:grid;grid-template-columns:1.65fr 1fr;align-items:center;gap:2.5rem;padding:2.5rem;}
.preview-image{padding:1.25rem;background:var(--surface);border-radius:.6rem;}
.preview-image img{width:100%;height:auto;aspect-ratio:1.44;object-fit:contain;border-radius:.25rem;}
.preview-info h2{font-size:2.75rem;letter-spacing:-.045em;line-height:1.12;margin-top:1rem;}
.preview-description{font-size:1.0625rem;line-height:1.75;margin-top:1.5rem;color:var(--muted);}
.preview-region{font-size:max(.8125rem,13px);color:var(--muted);margin-top:1rem;}
.preview-info .button{margin-top:2rem;}
.preview-pagination{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem 2rem;border-top:1px solid var(--line);}
.preview-pagination button{display:flex;align-items:center;gap:1.25rem;min-height:2.75rem;padding:.5rem 0;border:0;background:none;color:var(--ink);font-size:.875rem;}
.preview-pagination button:hover,.preview-close:hover{color:var(--accent);}
@media(min-width:681px) and (max-width:1000px){
  .project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:3rem 2rem;}
  .project,.project:nth-child(2),.project:nth-child(3){grid-column:auto;padding-top:0;}
  .steps,.engagement-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:2.5rem;}
  .steps p{max-width:24rem;}
  .preview-content{grid-template-columns:1.25fr 1fr;gap:2rem;padding:2rem;}
  .preview-description{font-size:1.25rem;}
}
@media(max-width:680px){
  .mobile-nav{max-height:calc(100dvh - 4.5rem);overflow-y:auto;overscroll-behavior:contain;}
  .project-dialog{width:calc(100% - 1rem);max-width:calc(100% - 1rem);max-height:calc(100dvh - 1rem);border-radius:.8rem;}
  .preview-toolbar{padding:.65rem 1rem;}
  .preview-toolbar>p,.preview-close{font-size:.75rem;}
  #preview-count{font-size:.6875rem;margin-left:.75rem;}
  .preview-close{gap:.8rem;}
  .preview-content{display:block;padding:1rem;}
  .preview-image{padding:.75rem;}
  .preview-info{padding:1.5rem .25rem .5rem;}
  .preview-info h2{font-size:2rem;margin-top:.75rem;}
  .preview-description{font-size:.9375rem;margin-top:1rem;}
  .preview-region{font-size:.75rem;}
  .preview-info .button{margin-top:1.5rem;}
  .preview-pagination{padding:.75rem 1rem;gap:.75rem;}
  .preview-pagination button{gap:.6rem;font-size:.75rem;}
}
@media(prefers-reduced-motion:reduce){.desktop-nav a::after,.project-open>span,.service-list h3,.faq-list summary,.more-work>summary>span,.full-quote>summary>span,.faq-list summary>span{transition:none;}}

/* Booking — a branded picker on live Cal.com availability.
   Same native <dialog> idiom as the project lightbox, so focus trapping, Escape
   and the backdrop come from the platform rather than from script. */
.book-dialog{width:min(calc(100% - 3rem),68rem);}
.quote-dialog{width:min(calc(100% - 3rem),52rem);}
/* Shared dialog chrome — booking and quote are the same sheet with different contents. */
.sheet{max-height:calc(100dvh - 3rem);margin:auto;padding:0;color:var(--ink);background:var(--bg);border:1px solid var(--line);border-radius:1.1rem;overscroll-behavior:contain;}
.sheet::backdrop{background:rgba(2,12,8,.78);backdrop-filter:blur(6px);}
:root:has(.sheet[open]){overflow:hidden;}
.sheet-toolbar{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:1rem 2rem;border-bottom:1px solid var(--line);position:sticky;top:0;background:var(--bg);z-index:1;}
.sheet-toolbar .eyebrow{margin-bottom:0;}
.sheet-close{display:flex;align-items:center;gap:1.5rem;min-height:2.75rem;background:none;border:0;padding:.5rem 0 .5rem 1rem;color:var(--ink);font-size:.875rem;transition:color .2s;}
.sheet-close span{font-size:1.75rem;line-height:1;}
.sheet-close:hover{color:var(--accent);}
.book-body{display:grid;grid-template-columns:1.35fr 1fr;gap:3rem;padding:2.5rem;}
/* Without this the scrolling date rail sets the column min-content width and the
   dialog outgrows its own cap — same guard .project carries in the work grid. */
.book-body>*{min-width:0;}
.book-when h2{font-size:2.75rem;line-height:1.1;letter-spacing:-.045em;}
.book-lede{font-size:1rem;line-height:1.7;color:var(--muted);margin-top:1.25rem;max-width:26rem;}

/* Date strip: the month rail scrolls, the edge fades so it reads as continuing. */
/* Every open day is visible at once. A hidden-scrollbar rail gives a mouse user no
   way to know more dates exist; on touch the rail is kept, where swiping is obvious. */
.book-dates{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:2rem;}
.book-dates::-webkit-scrollbar{display:none;}
.book-date{flex:0 0 auto;width:4.5rem;padding:.8rem 0;border:1px solid var(--line);border-radius:.6rem;background:transparent;color:var(--ink);text-align:center;transition:border-color .2s,background .2s;}
.book-date span{display:block;font-family:var(--mono);font-size:max(.6875rem,11px);letter-spacing:.11em;text-transform:uppercase;color:var(--muted);}
.book-date b{display:block;font-family:var(--mono);font-size:1.375rem;font-weight:400;letter-spacing:-.02em;margin:.3rem 0 .2rem;}
.book-date small{display:block;font-family:var(--mono);font-size:max(.6875rem,11px);letter-spacing:.08em;text-transform:uppercase;color:var(--muted);}
.book-date:hover{border-color:var(--accent);}
.book-date.sel{border-color:var(--accent);background:var(--surface);}
.book-date.sel b{color:var(--accent);}

.book-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.5rem;margin-top:1.25rem;}
.book-slot{padding:.75rem 0;border:1px solid var(--line);border-radius:3rem;background:transparent;font-family:var(--mono);font-size:max(.8125rem,13px);color:var(--muted);text-align:center;min-height:2.75rem;transition:border-color .2s,color .2s,background .2s;}
.book-slot:hover{border-color:var(--accent);color:var(--ink);}
.book-slot.sel{border-color:var(--accent);background:var(--surface);color:var(--accent);}
/* The API returns only free slots. A gap between two free ones is a real booking —
   show it struck through, so the calendar reads as genuinely lived-in. */
.book-slot.taken{position:relative;border-style:dashed;color:var(--muted);opacity:.5;cursor:not-allowed;text-decoration:line-through;text-decoration-thickness:1px;}
.book-slot.taken:hover{border-color:var(--line);color:var(--muted);}
.book-tz{font-family:var(--mono);font-size:max(.6875rem,11px);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);margin-top:1.25rem;}
.book-empty{font-size:1rem;line-height:1.7;color:var(--muted);margin-top:2rem;}

.book-summary{display:flex;align-items:center;gap:.75rem;font-family:var(--mono);font-size:max(.75rem,12px);letter-spacing:.04em;color:var(--muted);border-left:2px solid var(--accent);padding:.5rem 0 .5rem 1rem;min-height:2.75rem;margin-bottom:1.75rem;}
.book-summary i{width:.35rem;height:.35rem;border-radius:50%;background:var(--accent);flex:0 0 auto;}
.field{margin-bottom:1.5rem;}
.field label{display:block;font-family:var(--mono);font-size:max(.6875rem,11px);letter-spacing:.11em;text-transform:uppercase;color:var(--muted);margin-bottom:.6rem;}
.field label span{text-transform:none;letter-spacing:0;}
.field input,.field textarea{width:100%;background:transparent;color:var(--ink);font-family:var(--sans);font-size:.9375rem;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:.6rem 0;transition:border-color .2s;}
.field textarea{resize:vertical;min-height:3.5rem;line-height:1.6;}
.field input::placeholder,.field textarea::placeholder{color:var(--muted);opacity:.65;}
.field input:focus,.field textarea:focus{outline:0;border-bottom-color:var(--accent);}
/* Full-width submit: the label stays optically centred, the arrow sits at the end
   of the button rather than floating beside the text mid-way across. */
.sheet-submit{width:100%;gap:1rem;margin-top:.5rem;position:relative;}
.sheet-submit>span{position:absolute;right:1.7rem;top:50%;transform:translateY(-50%);}
.sheet-submit[disabled]{background:var(--surface);color:var(--muted);cursor:not-allowed;}
.sheet-submit[disabled]:hover{transform:none;}
.sheet-error{font-size:max(.8125rem,13px);line-height:1.6;color:var(--ink);margin-top:1rem;}
.sheet-error a{border-bottom:1px solid var(--accent);}
.sheet-note{font-size:max(.75rem,12px);line-height:1.6;color:var(--muted);margin-top:1rem;}
.sheet-done{padding:4rem 2.5rem 4.5rem;text-align:center;}
/* Scoped to beat .sheet-done>p below (0,1,1), which was winning on specificity and
   repainting the tick in --muted on an --accent circle: 1.2:1, an invisible check on
   the booking confirmation. It was also overriding the tick's size and margins. */
.sheet-done>.sheet-tick{width:3.25rem;height:3.25rem;margin:0 auto 1.75rem;display:grid;place-items:center;border-radius:50%;background:var(--accent);color:var(--button-ink);font-size:1.5rem;max-width:none;}
.sheet-done h2{font-size:2.75rem;}
.sheet-done>p{font-size:1rem;line-height:1.75;color:var(--muted);margin:1.25rem auto 2rem;max-width:26rem;}

/* Fallback: if availability can't be reached, hand over to the Cal.com embed
   rather than leaving a dead button. */
.cal-wrap{margin-top:2rem;height:min(65vh,38rem);border:1px solid var(--line);border-radius:.6rem;overflow:hidden;}
.cal-wrap iframe{width:100%;height:100%;border:0;}
.cal-loading{font-family:var(--mono);font-size:max(.75rem,12px);letter-spacing:.1em;text-transform:uppercase;color:var(--muted);padding:2rem;}

@media(min-width:681px) and (max-width:1000px){
  .book-body{grid-template-columns:1fr;gap:2.5rem;padding:2rem;}
  .book-when h2{font-size:2.4rem;}
  .book-slots{grid-template-columns:repeat(5,minmax(0,1fr));}
  .book-lede,.book-empty,.sheet-done>p{font-size:1.25rem;}
  .book-slot,.book-summary,.sheet-error{font-size:1.0625rem;}
  .field input,.field textarea,.field select,.faq-list summary{font-size:1.25rem;}
  .field label,.book-tz,.sheet-note,.book-date span,.book-date small{font-size:.9375rem;}
}
@media(max-width:680px){
  .sheet{max-width:calc(100% - 1rem);max-height:calc(100dvh - 1rem);border-radius:.8rem;}
  .book-dialog,.quote-dialog{width:calc(100% - 1rem);}
  .sheet-toolbar{padding:.65rem 1rem;}
  .sheet-toolbar .eyebrow,.sheet-close{font-size:.6875rem;}
  .sheet-close{gap:.8rem;}
  .book-body{grid-template-columns:1fr;gap:2.25rem;padding:1.5rem 1.25rem 2rem;}
  .book-when h2{font-size:2rem;}
  .book-lede{font-size:.9375rem;margin-top:1rem;}
  .book-dates{flex-wrap:nowrap;overflow-x:auto;padding-bottom:.5rem;margin-top:1.5rem;scrollbar-width:none;-webkit-overflow-scrolling:touch;mask-image:linear-gradient(to right,#000 92%,transparent);-webkit-mask-image:linear-gradient(to right,#000 92%,transparent);}
  .book-date{width:3.9rem;padding:.7rem 0;}
  .book-slots{grid-template-columns:repeat(3,minmax(0,1fr));}
  .book-summary{font-size:.6875rem;margin-bottom:1.5rem;}
  .sheet-done{padding:3rem 1.25rem 3.5rem;}
  .sheet-done h2{font-size:2rem;}
  .cal-wrap{height:min(70vh,34rem);}
}

/* Footer navigation — pairs down to two columns before it stacks, so the labels
   never sit alone above a single link. */
@media(min-width:681px) and (max-width:1000px){
  .footer-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:2.5rem 3rem;}
  .footer-col a{font-size:1.0625rem;}
}
@media(max-width:680px){
  .footer-grid{grid-template-columns:1fr 1fr;gap:1.75rem 1rem;padding-bottom:2.5rem;}
  .footer-col .eyebrow{margin-bottom:.75rem;}
  .footer-col a{font-size:.875rem;min-height:2.5rem;padding-block:.4rem;}
  .footer-wordmark{margin-top:2.5rem;}
  .footer-bottom{align-items:flex-start;}
}

@media(min-width:681px) and (max-width:1000px){
  .contact-bottom{gap:2.5rem;}
  .contact-direct a{font-size:1.0625rem;}
}

/* A ghosted ampersand cropped by the slab's corner — the mark the hero sculpts and
   the wordmark signs off with, used here as texture rather than as type. */
.contact{position:relative;overflow:hidden;}
.contact>.container{position:relative;z-index:1;}
/* Brand monogram, not a type glyph any more, so it is sized by width rather than
   font-size. currentColor keeps it on --accent at 8%, which is what lets the same
   markup work in both themes. */
.contact-mark{position:absolute;z-index:0;top:2rem;right:2rem;display:block;width:26rem;height:auto;color:var(--accent);opacity:.08;pointer-events:none;user-select:none;}
@media(min-width:681px) and (max-width:1000px){.contact-mark{width:19rem;top:1.75rem;right:1.75rem;}}
@media(max-width:680px){.contact-mark{width:11rem;top:1.25rem;right:1.25rem;opacity:.07;}}

/* Wordmark lockup: what we do on the left, what time it is where we do it on the right. */
.footer-lockup{display:flex;justify-content:space-between;align-items:end;gap:2rem;margin-top:.875rem;padding-bottom:1rem;}
.footer-tagline{font-family:var(--mono);font-size:max(.75rem,12px);letter-spacing:.22em;text-transform:uppercase;color:var(--muted);}
.footer-clocks{display:flex;flex-wrap:wrap;gap:2.875rem;list-style:none;margin:0;padding:0;}
.footer-clocks li{display:block;}
.footer-clocks span{display:block;font-family:var(--mono);font-size:max(.6875rem,11px);letter-spacing:.16em;text-transform:uppercase;color:var(--muted);margin-bottom:.4375rem;}
.footer-clocks time{font-family:var(--mono);font-size:.875rem;letter-spacing:.04em;color:var(--ink);}
@media(min-width:681px) and (max-width:1000px){
  .member-avatar{width:4.25rem;height:4.25rem;font-size:1.375rem;}
  .footer-tagline,.footer-clocks span{font-size:.9375rem;}
  .footer-clocks time{font-size:1.0625rem;}
}
@media(max-width:680px){
  .footer-lockup{display:block;padding-bottom:0;}
  .team{gap:1.75rem;}
  .member{gap:1rem;}
  .member-avatar{width:3.25rem;height:3.25rem;font-size:1.0625rem;}
    .footer-clocks{gap:1.75rem;margin-top:2rem;padding-bottom:2rem;}
  .footer-clocks span{font-size:.6875rem;}
  .footer-clocks time{font-size:.8125rem;}
}

/* The team column sits in from the copy, so the two halves read as separate columns
   rather than one run-on block. Removed once the layout stacks on phones. */
.team{padding-left:7rem;}
@media(min-width:681px) and (max-width:1100px){.team{padding-left:3rem;}}
@media(max-width:680px){.team{padding-left:0;}}

/* Quote — the same sheet as booking, carrying a form instead of a picker. */
.quote-body{padding:2.5rem;}
.quote-body h2{font-size:2.75rem;line-height:1.1;letter-spacing:-.045em;}
.quote-lede{font-size:1rem;line-height:1.7;color:var(--muted);margin:1.25rem 0 2.25rem;max-width:30rem;}
.field-row{display:grid;grid-template-columns:1fr 1fr;gap:1.5rem;}
.field-row>*{min-width:0;}
.field select{width:100%;background:transparent;color:var(--ink);font-family:var(--sans);font-size:.9375rem;border:0;border-bottom:1px solid var(--line);border-radius:0;padding:.6rem 0;transition:border-color .2s;appearance:none;background-image:linear-gradient(45deg,transparent 50%,var(--muted) 50%),linear-gradient(135deg,var(--muted) 50%,transparent 50%);background-position:calc(100% - 9px) calc(50% + 1px),calc(100% - 4px) calc(50% + 1px);background-size:5px 5px,5px 5px;background-repeat:no-repeat;}
.field select:focus{outline:0;border-bottom-color:var(--accent);}
.field select option{background:var(--bg);color:var(--ink);}
.sheet-switch{font-size:max(.8125rem,13px);line-height:1.6;color:var(--muted);margin-top:1.25rem;padding-top:1.25rem;border-top:1px solid var(--line);}
.sheet-switch button{background:none;border:0;padding:0;color:var(--ink);font-size:inherit;border-bottom:1px solid var(--accent);transition:color .2s;}
.sheet-switch button:hover{color:var(--accent);}
@media(min-width:681px) and (max-width:1000px){
  .quote-body h2{font-size:2.4rem;}
  .quote-lede,.sheet-switch{font-size:1.25rem;}
}
@media(max-width:680px){
  .quote-body{padding:1.5rem 1.25rem 2rem;}
  .quote-body h2{font-size:2rem;}
  .quote-lede{font-size:.9375rem;margin:1rem 0 1.75rem;}
  .field-row{grid-template-columns:1fr;gap:0;}
  .sheet-switch{font-size:.75rem;}
}

/* Quote triggers: buttons standing in for links, so they need the browser defaults off. */
.contact-actions{display:flex;align-items:center;flex-wrap:wrap;gap:1.5rem 2.5rem;margin-top:2rem;}
.contact-invite .button{margin-top:0;}
.contact-quote{background:none;border:0;border-bottom:1px solid var(--line);color:var(--ink);}
.footer-col button{display:inline-flex;align-items:center;gap:.6rem;min-height:2.75rem;padding:.5rem 0;background:none;border:0;font-size:.9375rem;color:var(--muted);transition:color .2s;}
.footer-col button:hover{color:var(--ink);}
.footer-col button span{font-size:1.05rem;line-height:1;}
@media(min-width:681px) and (max-width:1000px){.footer-col button{font-size:1.0625rem;}}
@media(max-width:680px){
  .contact-actions{gap:1.25rem;margin-top:1.75rem;}
  .footer-col button{font-size:.875rem;min-height:2.5rem;padding-block:.4rem;}
}