:root{--ease-arrive:cubic-bezier(.16,1,.3,1);--motion-fast:150ms;--motion-state:260ms}
button,input,textarea{caret-color:var(--forest)}
html{scrollbar-color:#a8b3a1 var(--paper)}
.button{position:relative;overflow:hidden;transition:background var(--motion-state),color var(--motion-state),transform var(--motion-fast),box-shadow var(--motion-state)}
.button:hover{transform:translateY(-2px);box-shadow:0 7px 14px -9px #16271fcc}
.button:active{transform:translateY(1px) scale(.97);box-shadow:none;transition-duration:100ms}
.button>span,.text-link>span,.round-arrow{transition:transform var(--motion-state) var(--ease-arrive),background var(--motion-state),color var(--motion-state)}
.button:hover>span,.text-link:hover>span{transform:translate(3px,-3px)}
.button:active>span,.text-link:active>span{transform:translate(1px,-1px)}
.button.light:hover{background:var(--stone)}
.text-link{transition:color var(--motion-fast),border-color var(--motion-state),transform var(--motion-fast)}
.text-link:active{transform:translateY(2px)}
.desktop-nav>a,.service-menu summary{position:relative;padding-block:12px;transition:color var(--motion-fast)}
.desktop-nav>a::after,.service-menu summary::after{content:'';position:absolute;bottom:5px;left:0;right:0;height:1px;background:var(--clay);transform:scaleX(0);transform-origin:left;transition:transform 260ms var(--ease-arrive)}
.desktop-nav>a:hover::after,.desktop-nav>a:focus-visible::after,.service-menu:hover summary::after,.service-menu[open] summary::after{transform:scaleX(1)}
.desktop-nav>a:active,.service-menu summary:active{transform:translateY(1px)}
.service-menu summary{gap:9px;list-style:none}
.service-chevron{transition:transform 320ms var(--ease-arrive);flex-shrink:0}
.service-menu[open] .service-chevron{transform:rotate(180deg)}
.service-menu>div{top:100%;left:-22px;min-width:290px;padding:10px;background:var(--paper);border:0;box-shadow:0 18px 34px -12px #1c302c3b}
.service-menu>div::before{content:'';position:absolute;left:0;right:0;top:-12px;height:12px}
.service-menu[open]>div{animation:service-unfold 300ms var(--ease-arrive) both;transform-origin:top center}
.service-menu.is-closing>div{animation:service-fold 140ms ease-in both}
.service-menu.is-closing .service-chevron{transform:rotate(0)}
.service-menu a{display:flex;align-items:center;gap:15px;padding:16px 14px;font-size:13px;line-height:1.5;transition:background var(--motion-state),color var(--motion-state),transform var(--motion-fast)}
.service-icon{flex-shrink:0;transition:transform var(--motion-state) var(--ease-arrive)}
.service-menu a:hover,.service-menu a:focus-visible{background:#e7ebe0;color:var(--forest)}
.service-menu a:hover .service-icon{transform:translateX(3px)}
.service-menu a:active{transform:scale(.98)}
@keyframes service-unfold{from{clip-path:inset(0 0 100% 0);opacity:.3;transform:translateY(-5px)}to{clip-path:inset(0);opacity:1;transform:translateY(0)}}
@keyframes service-fold{to{opacity:0;transform:translateY(-5px)}}
.filter,.choice{transition:background var(--motion-state),border-color var(--motion-state),transform var(--motion-fast)}
.filter:hover,.choice:hover{background:#e7ebe0;border-color:var(--forest)}
.filter:active{transform:scale(.96)}
.filter.active:hover{background:var(--forest)}
.demo-controls button,.demo-controls a,.footer-links a,#mobile-nav a{transition:color var(--motion-fast),background var(--motion-state),transform var(--motion-fast),border-color var(--motion-state)}
.demo-controls button:hover,.demo-controls a:hover{color:var(--clay)}
.demo-controls button:active,.demo-controls a:active{transform:translateY(1px)}
#mobile-nav a:hover,#mobile-nav a:focus-visible{color:var(--clay);background:var(--stone)}
#mobile-nav a:active{transform:translateX(4px)}
.menu-toggle span{transition:transform var(--motion-state) var(--ease-arrive)}
.footer-links>div,.footer-bottom>div{font-size:12px}.footer-bottom p{font-size:11px}.footer-links .eyebrow,dialog .eyebrow{font-size:11px}.owner-drawer .button{font-size:12px}
.project-metrics{display:grid;grid-template-columns:repeat(4,1fr);padding-block:34px;border-block:1px solid var(--line)}
.project-metrics>a{padding:7px 28px;display:flex;align-items:baseline;gap:17px;border-right:1px solid var(--line);transition:color var(--motion-state),background var(--motion-state)}
.project-metrics>a:first-child{padding-left:0}.project-metrics>a:last-child{border-right:0;padding-right:0}
.metric-value{font-family:var(--serif);font-size:58px;line-height:1;letter-spacing:-.03em;color:var(--forest);font-variant-numeric:lining-nums tabular-nums}
.metric-unit{font-family:var(--sans);font-size:13px;letter-spacing:0}
.metric-label{font-size:12px;line-height:1.6;max-width:130px}
.project-metrics>a:hover .metric-label{text-decoration:underline;text-underline-offset:5px}
.project-metrics>a:active{background:var(--stone)}
.project-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-auto-rows:1fr;gap:28px;align-items:stretch}
.project-card{display:flex;flex-direction:column;min-width:0;height:100%}
.project-card .img-wrap{aspect-ratio:4/3}
.project-card img{height:100%;width:100%;object-position:center;transition:transform 650ms var(--ease-arrive)}
.project-info{flex:1;gap:15px;padding-top:23px}
.project-info>div{display:flex;flex-direction:column;min-width:0}
.project-info .eyebrow{font-size:9px;letter-spacing:.07em}
.project-info h3{font-size:clamp(29px,2.35vw,36px);line-height:1.12;letter-spacing:-.03em;text-wrap:balance;margin-bottom:14px}
.project-info p{font-size:14px;line-height:1.8;margin-top:auto;min-height:5.4em}
.project-info .round-arrow{width:34px;height:34px;margin-top:31px}
.project-card:hover img,.project-card:focus-visible img{transform:scale(1.055)}
.project-card:hover .round-arrow,.project-card:focus-visible .round-arrow{transform:rotate(45deg);background:var(--forest);color:var(--paper)}
.project-card:active .round-arrow{transform:rotate(45deg) scale(.88)}
#about .copy{max-width:560px}
#about .eyebrow{font-size:12px;letter-spacing:.11em}
#about h2{font-size:clamp(42px,4.2vw,62px);line-height:1.08;letter-spacing:-.03em;text-wrap:balance;margin-bottom:27px}
#about .copy>p{font-size:18px;line-height:1.8;max-width:58ch;text-wrap:pretty}
#about .principles{margin-top:32px}
#about .principles article{padding-block:23px}
#about .principles h3{font-family:var(--sans);font-size:17px;line-height:1.5;font-weight:600;letter-spacing:0;margin-bottom:8px}
#about .principles p{font-size:16px;line-height:1.75;margin:0;max-width:55ch}
#about .about-image img{height:700px}
@media(max-width:1100px){.project-grid{gap:20px}.project-info{gap:8px}.project-info .round-arrow{display:none}.project-info h3{font-size:30px}.project-info p{font-size:13px;min-height:7.2em}.project-metrics>a{padding-inline:18px;gap:12px}.metric-value{font-size:49px}.metric-label{font-size:11px}}
@media(max-width:800px){.project-metrics{grid-template-columns:1fr 1fr;padding-block:16px}.project-metrics>a{padding:22px!important;border:0;gap:18px}.project-metrics>a:nth-child(odd){border-right:1px solid var(--line)}.project-metrics>a:nth-child(-n+2){border-bottom:1px solid var(--line)}.metric-label{font-size:13px}.project-grid{grid-template-columns:1fr;gap:38px}.project-card .img-wrap{aspect-ratio:3/2}.project-info h3{font-size:36px}.project-info p{font-size:15px;min-height:0;margin:0}.project-info .round-arrow{display:flex;margin-top:28px;width:40px;height:40px}.project-info{gap:20px}#about .split{grid-template-columns:1fr;gap:40px}#about .copy{max-width:650px}#about .about-image img{height:440px}#about .copy>p{font-size:17px}#about h2{max-width:550px}}
@media(max-width:540px){.metric-value{font-size:47px}.metric-label{font-size:12px}.project-metrics>a{padding:20px 12px!important;gap:12px}.metric-unit{font-size:11px}.project-card .img-wrap{aspect-ratio:4/3}.project-info h3{font-size:34px}.project-info .eyebrow{font-size:9px}.project-info p{font-size:15px}#about h2{font-size:42px}#about .eyebrow{font-size:11px}#about .principles h3{font-size:17px}#about .about-image img{height:360px}}
@media(max-width:800px){.demo-inner>span{font-size:11px}.demo-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;align-items:center}.demo-controls button,.demo-controls a{font-size:11px;line-height:1.6;text-align:left}.nav-cta{font-size:11px}.demo-inner{gap:8px}.footer-links>div{font-size:12px}.footer-bottom>div{font-size:11px}.owner-drawer .button{font-size:11px}}
@media(max-width:540px){.project-metrics>a{flex-direction:column;align-items:flex-start;gap:9px}.metric-label{max-width:none}}
@media(prefers-reduced-motion:reduce){.service-menu[open]>div{animation:none}.button:hover,.button:active,.button:hover>span,.text-link:hover>span,.project-card:hover img,.project-card:focus-visible img,.service-menu a:hover .service-icon,.project-card:hover .round-arrow,.project-card:active .round-arrow{transform:none}.service-menu[open] .service-chevron{transform:rotate(180deg)}}