:root {
 --paper: #0b0e0d;
 --ink: #e5e8de;
 --muted: #909b91;
 --line: #29322e;
 --accent: #c5d4b3;
 --dark: #0b0e0d;
 --sans: 'DM Sans', Arial, sans-serif;
 --display: 'Barlow Condensed', 'Arial Narrow', sans-serif;
 --mono: 'IBM Plex Mono', monospace;
}
* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
 margin: 0;
 color: var(--ink);
 background-color: var(--paper);
 background-image: linear-gradient(#9bad9809 1px, transparent 1px), linear-gradient(90deg, #9bad9809 1px, transparent 1px), linear-gradient(#9bad9806 1px, transparent 1px), linear-gradient(90deg, #9bad9806 1px, transparent 1px);
 background-size: 160px 160px, 160px 160px, 32px 32px, 32px 32px;
 font: 14px/1.7 var(--sans);
 overflow-x: clip;
}
body:has(dialog[open]) { overflow: hidden; }
a { color: inherit; text-decoration: none; }
button, input, textarea { font: inherit; }
button { color: inherit; background: transparent; border: 0; cursor: pointer; }
a, button { touch-action: manipulation; -webkit-tap-highlight-color: transparent; }
button:focus-visible, a:focus-visible, input:focus-visible, textarea:focus-visible, summary:focus-visible, canvas:focus-visible, article:focus-visible { outline: 1px solid var(--accent); outline-offset: 5px; }
img { width: 100%; height: 100%; object-fit: cover; display: block; }
p, figure { margin: 0; }
h1, h2, h3 { font-family: var(--display); font-weight: 500; letter-spacing: -.015em; line-height: 1; margin: 0; }
h1 { font-size: clamp(70px, 8.5vw, 140px); text-transform: uppercase; }
h2 { font-size: clamp(45px, 5.7vw, 86px); }
h3 { font-size: 30px; }
em { font: inherit; color: var(--accent); }
[hidden] { display: none !important; }
.section-pad { padding: 95px 5%; }
.eyebrow, .section-label { font: 9px/1.7 var(--mono); letter-spacing: .08em; color: var(--muted); text-transform: uppercase; }
.site-header { height: 84px; padding: 0 4%; border-bottom: 1px solid var(--line); display: flex; align-items: center; justify-content: space-between; gap: 40px; background: #0b0e0de8; position: relative; z-index: 20; }
.brand { display: flex; align-items: center; gap: 13px; flex-shrink: 0; }
.brand img { width: 43px; height: 43px; object-fit: contain; filter: invert(1); }
.brand > span { font: 17px/1.2 var(--sans); letter-spacing: -.035em; }
.brand small { display: block; font: 6px var(--mono); letter-spacing: .15em; margin-top: 8px; color: var(--muted); }
.site-header nav { display: flex; gap: 30px; margin-left: auto; }
.site-header nav a { font: 10px var(--mono); padding: 12px 0; border-bottom: 1px solid transparent; color: var(--muted); }
.site-header nav a:hover, .site-header nav a[aria-current=page] { color: var(--ink); border-color: var(--accent); }
.header-controls { display: flex; gap: 10px; align-items: center; }
.header-controls > button { border: 1px solid var(--line); width: 30px; height: 30px; font: 11px var(--mono); }
.header-controls .menu-toggle { display: none; }
#mobile-menu { position: absolute; left: 0; right: 0; top: 76px; z-index: 19; padding: 20px 5% 30px; background: #0b0e0d; border-bottom: 1px solid var(--line); }
#mobile-menu a { display: flex; justify-content: space-between; padding: 16px 0; border-bottom: 1px solid var(--line); font: 28px var(--display); }
.skip { position: absolute; top: -90px; left: 10px; z-index: 100; background: var(--ink); color: var(--paper); padding: 12px; }
.skip:focus { top: 8px; }
.cad-home { height: calc(100svh - 84px); min-height: 650px; max-height: 1050px; display: grid; grid-template-columns: 35% 65%; border-bottom: 1px solid var(--line); }
.cad-hero-copy { padding: 65px 10% 35px 11.4%; display: flex; flex-direction: column; justify-content: center; align-items: flex-start; position: relative; }
.cad-hero-copy h1 { font: 600 clamp(80px, 8.4vw, 136px)/.9 var(--display); letter-spacing: -.025em; margin: 32px 0; }
.hero-rule { width: 45px; height: 2px; background: var(--accent); margin-bottom: 25px; }
.cad-hero-copy > p:not(.eyebrow) { color: var(--muted); font-size: 13px; line-height: 1.9; }
.drawing-link, .under-link, .pill-link { display: flex; justify-content: space-between; align-items: center; gap: 35px; border-bottom: 1px solid var(--line); padding: 16px 0; font: 11px var(--mono); }
.drawing-link { margin-top: 30px; width: 100%; max-width: 250px; }
.drawing-link span, .under-link span, .pill-link span { font-size: 23px; }
.drawing-link:hover, .under-link:hover, .pill-link:hover { color: var(--accent); border-color: var(--accent); }
.hero-footnote { position: absolute; bottom: 24px; left: 11.4%; font: 7px var(--mono); color: #708074; letter-spacing: .04em; }
.cad-workbench { display: flex; flex-direction: column; position: relative; min-width: 0; height: 650px; border: 1px solid var(--line); background: #0b0e0d90; }
.cad-home .cad-workbench { border-top: 0; border-right: 0; border-bottom: 0; height: 100%; }
.cad-toolbar { min-height: 59px; display: flex; align-items: center; justify-content: space-between; padding: 10px 18px; gap: 20px; border-bottom: 1px solid var(--line); background: #111713b5; }
.view-tabs { display: flex; gap: 4px; }
.view-tabs button { display: flex; align-items: center; gap: 9px; padding: 9px 12px; font: 12px var(--mono); color: var(--muted); border: 1px solid transparent; min-height: 36px; }
.view-tabs button span { font-size: 9px; }
.view-tabs button.selected { border-color: #6c7f65; background: #243125; color: var(--accent); }
.viewport-tools { display: flex; gap: 5px; }
.viewport-tools button { width: 29px; height: 29px; border: 1px solid var(--line); font: 15px var(--mono); }
.viewport-tools button:hover { background: #263226; }
.drawing-surface { position: relative; flex: 1; min-height: 0; overflow: hidden; isolation: isolate; background-image: linear-gradient(#a6b99f0b 1px, transparent 1px), linear-gradient(90deg, #a6b99f0b 1px, transparent 1px); background-size: 32px 32px; }
#model-host, #plan-canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
#model-host canvas { display: block; width: 100%; height: 100%; cursor: grab; touch-action: pan-y; }
#model-host canvas:active { cursor: grabbing; }
#plan-canvas { cursor: crosshair; touch-action: pan-y; }
.drawing-label { position: absolute; top: 18px; left: 18px; display: flex; gap: 10px; align-items: flex-start; pointer-events: none; font: 9px/1.6 var(--mono); color: #a9b79f; }
.drawing-label small { display: block; color: #5d6f61; font-size: 7px; }
.drawing-marker { width: 7px; height: 7px; border: 1px solid #98ae89; margin-top: 4px; }
.view-presets { position: absolute; top: 18px; right: 18px; display: flex; gap: 4px; }
.view-presets button { font: 7px var(--mono); color: #768a7b; border: 1px solid #2b3a2e; padding: 7px 8px; background: #0b0e0dd9; }
.view-presets button.selected { color: var(--accent); border-color: #72876c; }
.axis-indicator { position: absolute; bottom: 22px; right: 25px; width: 36px; height: 36px; border-left: 1px solid #708a72; border-bottom: 1px solid #aab595; transform: skewY(-25deg); pointer-events: none; font: 8px var(--mono); color: #8c9a86; }
.axis-indicator span:nth-child(1) { position: absolute; right: -8px; bottom: -12px; }
.axis-indicator span:nth-child(2) { position: absolute; top: -15px; left: -3px; }
.axis-indicator span:nth-child(3) { position: absolute; left: -15px; bottom: -13px; }
.drawing-status { display: flex; justify-content: space-between; align-items: center; gap: 15px; padding: 13px 18px; border-top: 1px solid var(--line); font: 7px/1.5 var(--mono); color: #6f8174; }
#drawing-mode-label { color: #aaba9f; }
.sequence-controls { padding: 13px 18px; border-top: 1px solid var(--line); background: #101710; }
.sequence-heading { display: flex; justify-content: space-between; gap: 15px; align-items: center; font: 7px var(--mono); color: var(--muted); }
.sequence-heading button { font: 9px var(--mono); color: var(--accent); padding: 5px 0; }
.phase-buttons { display: grid; grid-template-columns: repeat(4,1fr); gap: 5px; margin-top: 10px; }
.phase-buttons button { border-bottom: 2px solid #28362a; text-align: left; font: 8px var(--mono); color: #6d7d70; padding: 9px 0; }
.phase-buttons button.selected, .phase-buttons button.completed { border-color: #9fb18e; color: #d3dccb; }
.phase-slider-label { font: 7px var(--mono); color: var(--muted); margin-top: 9px; display: flex; gap: 20px; align-items: center; }
#phase-slider { accent-color: #a0b68f; flex: 1; height: 12px; min-width: 0; }
#model-fallback { position: absolute; left: 10%; right: 10%; top: 45%; text-align: center; font: 11px var(--mono); color: var(--muted); }
.intro, .service-teaser { display: grid; grid-template-columns: 1fr 2fr; gap: 6%; border-bottom: 1px solid var(--line); }
.intro > .eyebrow, .service-teaser > .eyebrow { padding-top: 9px; }
.intro-copy { display: grid; grid-template-columns: 1.25fr 1fr; gap: 12%; margin-top: 35px; align-items: end; }
.intro-copy p { color: var(--muted); font-size: 14px; line-height: 1.9; }
.section-head { display: flex; justify-content: space-between; align-items: end; gap: 50px; margin-bottom: 45px; }
.section-head .eyebrow { margin-bottom: 23px; }
.section-head > .under-link { min-width: 190px; }
.section-head > p { font: 9px/1.7 var(--mono); color: var(--muted); }
.home-project-grid, .collection-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 55px 5%; }
.card-large, .collection-grid > :first-child { grid-column: 1/-1; }
.project-card { min-width: 0; position: relative; }
.project-image { height: 400px; position: relative; border: 1px solid #384239; overflow: hidden; isolation: isolate; }
.card-large .project-image, .collection-grid > :first-child .project-image { height: 620px; }
.project-image > img { transition: transform .8s, filter .8s; filter: saturate(.75); }
.project-card:hover .project-image > img { transform: scale(1.025); filter: saturate(1); }
.card-meta { display: grid; grid-template-columns: 1fr auto 25px; gap: 20px; align-items: center; padding: 18px 0; border-bottom: 1px solid var(--line); }
.card-meta h3 { font: 500 29px var(--display); }
.card-meta > span { font: 8px var(--mono); color: var(--muted); }
.card-meta > span:last-child { font-size: 20px; text-align: right; }
.project-info-toggle { position: absolute; right: 16px; bottom: 16px; border: 1px solid #7c8c76; background: #0b110de8; padding: 9px 14px; display: flex; gap: 18px; align-items: center; font: 9px var(--mono); z-index: 3; }
.project-info-toggle span { font-size: 18px; line-height: 1; }
.floating-info { position: absolute; left: var(--preview-x,18px); top: var(--preview-y,18px); width: min(365px,calc(100% - 36px)); max-height: calc(100% - 36px); padding: 23px; background: #111a15f5; color: var(--ink); border: 1px solid #61715a; backdrop-filter: blur(18px); box-shadow: 0 14px 55px #0008; opacity: 0; visibility: hidden; pointer-events: none; transform: translateY(10px); transition: opacity .25s, transform .3s, visibility .25s; z-index: 5; overflow: auto; overscroll-behavior: contain; scrollbar-width: thin; scrollbar-color: #6b7d61 #111a15; }
.preview-open .floating-info { opacity: 1; visibility: visible; pointer-events: auto; transform: none; }
.floating-info > .eyebrow { font-size: 7px; color: #8d9e84; padding-right: 24px; }
.floating-info > h3 { font: 500 37px/1.1 var(--display); margin: 15px 0; }
.floating-info > p:not(.eyebrow) { font-size: 12px; line-height: 1.8; color: #a2afa1; }
.floating-info ul { list-style: none; margin: 17px 0 0; padding: 12px 0 0; border-top: 1px solid #354332; }
.floating-info li { font: 8px/1.8 var(--mono); color: #91a18a; padding-top: 4px; }
.preview-link { display: flex; align-items: center; justify-content: space-between; gap: 25px; font: 10px var(--mono); border-top: 1px solid #354332; margin-top: 18px; padding-top: 14px; }
.preview-link span { font-size: 22px; }
.preview-close { position: sticky; top: 0; float: right; width: 25px; height: 25px; display: grid; place-items: center; margin: -9px -9px 0 5px; background: #111a15; color: var(--muted); font-size: 13px; z-index: 2; }
.preview-open .preview-cue { transform: rotate(45deg); }
.preview-cue { transition: transform .25s; }
.image-interlude { height: 80svh; min-height: 520px; position: relative; color: white; border-block: 1px solid var(--line); }
.image-interlude::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent,#050b05bb); }
.image-interlude > div { position: absolute; bottom: 10%; left: 5%; right: 5%; z-index: 1; }
.image-interlude h2 { margin-top: 20px; font-size: clamp(50px,6.5vw,100px); }
.image-interlude .under-link { margin-top: 25px; width: 290px; border-color: #81937a; }
.service-teaser > div > a { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 25px 0; border-bottom: 1px solid var(--line); }
.service-teaser h2 { font-size: clamp(35px,4.1vw,65px); }
.service-teaser a > span { font-size: 28px; color: var(--accent); }
.service-teaser > div > p { margin-top: 25px; color: var(--muted); font-size: 12px; }
.next-chapter { display: flex; justify-content: space-between; align-items: center; gap: 30px; border-block: 1px solid #4b5d43; padding: 40px 5%; background: #162019; }
.next-chapter > a { display: flex; gap: 65px; align-items: center; font: 500 56px var(--display); line-height: 1; }
.next-chapter > a span { font-size: 32px; }
footer { padding: 45px 5% 25px; background: #0a0d0b; }
.footer-info { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 6%; font-size: 11px; }
.brand-name { font-size: 20px; letter-spacing: -.04em; }
.footer-info p { color: var(--muted); }
.footer-info > div { margin-left: auto; display: flex; flex-direction: column; gap: 10px; font: 9px/1.7 var(--mono); }
.footer-base { display: flex; justify-content: space-between; gap: 20px; margin-top: 40px; border-top: 1px solid var(--line); padding-top: 20px; font: 8px/1.6 var(--mono); color: #6c7b6d; }
.page-heading { padding-top: 75px; padding-bottom: 55px; border-bottom: 1px solid var(--line); }
.page-heading h1 { margin-top: 25px; }
.heading-bottom { display: flex; justify-content: space-between; align-items: end; gap: 40px; margin-top: 35px; }
.heading-bottom > p { color: var(--muted); font-size: 14px; max-width: 600px; }
.heading-bottom > span { font: 8px var(--mono); color: #738570; }
.projects-collection { padding-top: 40px; }
.category-nav { display: flex; flex-wrap: wrap; gap: 30px; border-bottom: 1px solid var(--line); margin-bottom: 45px; }
.category-nav a { font: 10px var(--mono); padding: 0 0 17px; color: var(--muted); border-bottom: 2px solid transparent; }
.category-nav a[aria-current=page] { color: var(--accent); border-color: var(--accent); }
.source-note { font: 9px/1.9 var(--mono); color: #7c8c7b; margin-top: 30px; }
.project-hero { height: calc(90svh - 84px); min-height: 500px; position: relative; border-bottom: 1px solid var(--line); }
.project-hero::after { content: ''; position: absolute; inset: 0; background: linear-gradient(#0000 20%,#030a05cc); }
.project-hero-copy { position: absolute; bottom: 10%; left: 5%; right: 5%; z-index: 1; }
.project-hero-copy h1 { margin: 25px 0 20px; font-size: clamp(70px,10vw,160px); }
.project-hero-copy p { font: 10px var(--mono); color: #bcc8b7; }
.project-story { display: grid; grid-template-columns: 1fr 2fr; gap: 6%; border-bottom: 1px solid var(--line); }
.project-facts { margin: 30px 0 0; padding: 0; list-style: none; max-width: 280px; }
.project-facts li { font: 9px/1.8 var(--mono); color: var(--muted); padding: 13px 0; border-top: 1px solid var(--line); }
.body-large { color: #a9b4a7; font-size: 21px; line-height: 1.8; max-width: 750px; margin-top: 30px; }
.body-copy { color: var(--muted); font-size: 14px; line-height: 1.9; margin-top: 25px; max-width: 650px; }
.material-tags { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 30px; }
.material-tags span { padding: 8px 14px; border: 1px solid #3d4a37; font: 8px var(--mono); color: #95a58a; }
.comparison-section { background: #121912; padding-top: 65px; border-bottom: 1px solid var(--line); }
.comparison { position: relative; width: 100%; aspect-ratio: 16/9; overflow: hidden; border: 1px solid #475841; }
.comparison > img, .comparison-top > img { position: absolute; inset: 0; }
.comparison-top { position: absolute; inset: 0; clip-path: inset(0 calc(100% - var(--split)) 0 0); }
.comparison-divider { position: absolute; left: var(--split); top: 0; bottom: 0; width: 1px; background: #d3e0c7; display: grid; place-items: center; color: #0b0e0d; font-size: 25px; pointer-events: none; }
.comparison-divider::before { content: ''; position: absolute; width: 42px; height: 42px; background: #d3e0c7; z-index: -1; }
.comparison-label { position: absolute; top: 18px; padding: 8px 12px; font: 8px var(--mono); background: #10180ee8; color: #c5d4b3; pointer-events: none; }
.comparison-label.left { left: 18px; }
.comparison-label.right { right: 18px; }
.comparison input { position: absolute; inset: 0; width: 100%; height: 100%; margin: 0; opacity: 0; cursor: ew-resize; }
.comparison:focus-within { outline: 1px solid var(--accent); outline-offset: 4px; }
.gallery-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }
.gallery-frame { padding: 0; text-align: left; position: relative; min-width: 0; }
.gallery-frame > img { aspect-ratio: 16/9; height: auto; border: 1px solid #384239; }
.gallery-frame:first-child, .gallery-frame:nth-child(7n) { grid-column: 1/-1; }
.gallery-frame.portrait { width: 65%; margin: auto; grid-column: auto; }
.gallery-frame.portrait img { aspect-ratio: 2/3; object-fit: contain; }
.gallery-frame > span:not(.gallery-hover) { display: flex; justify-content: space-between; padding-top: 12px; font: 9px var(--mono); color: var(--muted); }
.gallery-frame b { font-weight: 400; font-size: 17px; }
.gallery-frame > .gallery-hover { position: absolute; left: 16px; top: 16px; max-width: calc(100% - 32px); padding: 11px 15px; background: #101a12ed; color: var(--accent); border: 1px solid #64795a; font: 10px var(--mono); opacity: 0; transform: translateY(8px); transition: opacity .25s,transform .25s; pointer-events: none; }
.gallery-frame:hover > .gallery-hover, .gallery-frame:focus-visible > .gallery-hover { opacity: 1; transform: none; }
.preview-next { background: #131c15; border-top: 1px solid var(--line); }
.preview-next > .eyebrow { margin-bottom: 30px; }
.preview-next .project-card { max-width: 1100px; margin-left: auto; }
.preview-next .project-image { height: 500px; }
.service-panels { display: grid; grid-template-columns: 1fr 1fr; gap: 55px 5%; padding-top: 55px; }
.service-panels .project-image { height: 450px; }
.service-panels .card-meta { grid-template-columns: 1fr 25px; }
.service-panels .card-meta > span:nth-child(2) { display: none; }
.service-detail-hero { display: grid; grid-template-columns: 1fr 1fr; min-height: 620px; border-bottom: 1px solid var(--line); }
.service-detail-hero > div { padding: 70px 10%; display: flex; flex-direction: column; align-items: flex-start; justify-content: center; }
.service-detail-hero h1 { margin: 30px 0; font-size: clamp(60px,6.7vw,105px); }
.service-detail-hero p:not(.eyebrow) { color: var(--muted); line-height: 1.9; font-size: 14px; max-width: 450px; }
.service-detail-hero .pill-link { width: 250px; margin-top: 30px; }
.service-detail-hero > img { height: 100%; max-height: 850px; border-left: 1px solid var(--line); }
.scope-list { margin-top: 45px; }
.scope-list > div { border-top: 1px solid var(--line); padding: 22px 0; }
.scope-list h3 { font-size: 29px; }
.related-project > .project-card { max-width: 1000px; }
.related-project > .project-card + .project-card { margin-top: 50px; }
.related-project .project-image { height: 500px; }
.approach-intro { display: grid; grid-template-columns: 1.3fr 1fr; gap: 7%; align-items: center; padding: 70px 5%; border-bottom: 1px solid var(--line); }
.approach-intro .cad-workbench { height: 650px; }
.approach-intro > div:last-child > p { color: var(--muted); line-height: 1.9; font-size: 14px; margin-top: 30px; max-width: 400px; }
.process-stages > article { display: grid; grid-template-columns: 1fr 2fr; gap: 6%; padding: 55px 0; border-top: 1px solid var(--line); }
.step-index { font: 500 110px/1 var(--display); color: #42563f; }
.process-stages h3 { font: 13px var(--mono); color: var(--accent); margin-top: 25px; }
.process-stages p { max-width: 600px; color: var(--muted); line-height: 1.9; margin-top: 20px; }
.studio-banner { position: relative; height: 75svh; min-height: 450px; border-block: 1px solid var(--line); }
.studio-banner p { position: absolute; left: 5%; bottom: 20px; padding: 10px 15px; background: #0c150de8; color: #b7c7ac; font: 8px var(--mono); }
.lead-architect { display: grid; grid-template-columns: 1fr 1fr; gap: 10%; align-items: center; border-bottom: 1px solid var(--line); }
.architect-photo { position: relative; height: 650px; border: 1px solid #3d4c36; }
.architect-photo img { object-position: center; }
.architect-photo figcaption { position: absolute; bottom: 18px; left: 18px; right: 18px; padding: 12px 15px; background: #111a14ed; border: 1px solid #5d7053; color: #bdccaf; font: 8px var(--mono); }
.lead-architect h2 { font-size: clamp(60px,7vw,110px); margin-top: 25px; }
.lead-architect .under-link { margin-top: 30px; max-width: 280px; }
.studio-values { display: grid; grid-template-columns: repeat(3,1fr); gap: 5%; background: #131b14; border-block: 1px solid var(--line); }
.studio-values h2 { font-size: 60px; }
.studio-values p { color: var(--muted); margin-top: 25px; max-width: 260px; }
.contact-page { display: grid; grid-template-columns: 1fr 1fr; gap: 10%; }
.contact-page h1 { font-size: clamp(70px,8.3vw,130px); margin-top: 30px; }
.contact-page .body-large { font-size: 20px; }
.contact-help { margin-top: 55px; max-width: 390px; }
.contact-help h2 { font-size: 37px; }
.contact-help p { color: var(--muted); font-size: 13px; line-height: 1.9; margin-top: 20px; }
.contact-help .source-note { font: 9px/1.9 var(--mono); }
form { min-width: 0; }
fieldset { border: 0; margin: 0 0 35px; padding: 0; display: flex; flex-wrap: wrap; gap: 10px; }
legend { font: 11px var(--mono); margin-bottom: 22px; padding: 0; }
.radio-option { border: 1px solid #3a4935; padding: 10px 12px; font: 9px var(--mono); display: flex; align-items: center; gap: 8px; cursor: pointer; }
.radio-option:has(input:checked) { border-color: #aec497; background: #263425; color: #d1e2bf; }
.radio-option input { width: 12px; margin: 0; accent-color: #acbf98; }
.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 25px; }
form > label, .form-row > label { display: block; font: 9px var(--mono); color: #b0bea9; margin-bottom: 30px; }
input:not([type=radio]):not([type=range]), textarea { display: block; width: 100%; min-width: 0; border: 0; border-bottom: 1px solid #3a4935; padding: 14px 0; background: transparent; color: var(--ink); border-radius: 0; font: 13px var(--sans); }
textarea { resize: vertical; }
::placeholder { color: #637361; }
.solid-button { display: flex; justify-content: space-between; align-items: center; width: 100%; padding: 18px 20px; background: #baccaa; color: #10170d; font: 11px var(--mono); }
.solid-button span { font-size: 24px; }
form .source-note { margin-top: 20px; font-size: 8px; }
.source-note a { text-decoration: underline; }
#brief-status { font: 11px/1.8 var(--mono); margin-top: 20px; }
.questions { border-top: 1px solid var(--line); max-width: 1100px; margin: auto; }
.questions h2 { margin: 20px 0 35px; }
details { border-top: 1px solid var(--line); }
details:last-child { border-bottom: 1px solid var(--line); }
summary { list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 24px 0; font-size: 17px; cursor: pointer; }
summary::-webkit-details-marker { display: none; }
summary span { font-size: 23px; }
details[open] summary span { transform: rotate(45deg); }
details p { max-width: 650px; padding-bottom: 25px; line-height: 1.9; color: var(--muted); font-size: 13px; }
.policy { min-height: 70vh; max-width: 1000px; }
.policy h1 { margin: 30px 0 45px; }
.policy h2 { font-size: 35px; margin: 30px 0 20px; }
.policy p { color: var(--muted); line-height: 1.9; }
dialog { width: 96vw; max-width: 1600px; height: 94svh; max-height: 100svh; padding: 23px; border: 1px solid #53664a; background: #0b100c; color: var(--ink); }
dialog::backdrop { background: #030603ed; backdrop-filter: blur(12px); }
.lightbox-bar { display: flex; justify-content: space-between; align-items: center; gap: 20px; height: 35px; font: 10px var(--mono); }
.lightbox-bar button { font: 10px var(--mono); }
#lightbox-image { height: calc(100% - 100px); object-fit: contain; margin: 15px 0; }
.lightbox-controls { height: 35px; display: flex; justify-content: center; align-items: center; gap: 40px; font: 10px var(--mono); }
.lightbox-controls button { font-size: 25px; }
.transition-panel { position: fixed; inset: 0; z-index: 90; background: #101a12; transform: translateY(100%); pointer-events: none; display: grid; place-items: center; transition: transform .3s; }
.transition-panel span { font: 600 40px var(--display); color: #bccdaa; }
.leaving .transition-panel { transform: none; }
.reveal { opacity: 0; transform: translateY(22px); transition: opacity .7s,transform .8s; }
.reveal.in-view, .motion-paused .reveal { opacity: 1; transform: none; }
.motion-paused * { animation-play-state: paused !important; }
@media (max-width:1050px) {
 .site-header { gap: 25px; }
 .site-header nav { gap: 20px; }
 .cad-home { grid-template-columns: 36% 64%; }
 .cad-hero-copy h1 { font-size: 9vw; }
 .cad-toolbar { padding-inline: 12px; gap: 8px; }
 .view-tabs button { padding: 8px; gap: 7px; }
 .drawing-status > span { display: none; }
 .intro-copy { grid-template-columns: 1fr; gap: 25px; }
 .intro-copy .under-link { width: 220px; }
 .project-image { height: 350px; }
 .card-large .project-image, .collection-grid > :first-child .project-image { height: 500px; }
 .card-meta { grid-template-columns: 1fr 25px; gap: 8px; }
 .card-meta > span:nth-child(2) { grid-row: 2; grid-column: 1; }
 .card-meta > span:last-child { grid-row: 1; grid-column: 2; }
 .service-panels .project-image { height: 400px; }
 .architect-photo { height: 550px; }
 .lead-architect { gap: 6%; }
 .approach-intro { gap: 4%; }
 .approach-intro .drawing-status #model-hint { display: none; }
}
@media (max-width:760px) {
 .site-header { height: 76px; padding-inline: 5%; }
 .brand img { width: 37px; height: 37px; }
 .brand > span { font-size: 16px; }
 .brand small { font-size: 5px; }
 .site-header nav { display: none; }
 .header-controls .menu-toggle { display: flex; align-items: center; justify-content: space-between; gap: 12px; border: 0; width: auto; font: 10px var(--mono); padding: 0; }
 .menu-toggle span { font-size: 19px; }
 .header-controls { gap: 12px; }
 .header-controls > button { width: 28px; height: 28px; }
 .section-pad { padding: 60px 5%; }
 h1 { font-size: 65px; }
 h2 { font-size: 46px; }
 .cad-home { display: flex; flex-direction: column; height: auto; min-height: 0; max-height: none; }
 .cad-hero-copy { padding: 35px 5% 30px; }
 .cad-hero-copy .eyebrow { font-size: 8px; }
 .cad-hero-copy h1 { font-size: 77px; line-height: .88; margin: 22px 0; }
 .hero-rule { display: none; }
 .cad-hero-copy > p:not(.eyebrow) { font-size: 11px; }
 .cad-hero-copy > p:not(.eyebrow) br { display: none; }
 .drawing-link { width: 195px; margin-top: 15px; padding: 10px 0; font-size: 10px; }
 .hero-footnote { display: none; }
 .cad-home .cad-workbench { height: 500px; border-left: 0; border-top: 1px solid var(--line); }
 .cad-workbench { height: 540px; }
 .cad-toolbar { min-height: 57px; padding: 9px 12px; }
 .view-tabs { width: 100%; gap: 5px; }
 .view-tabs button { justify-content: center; flex: 1; min-height: 38px; font-size: 12px; gap: 10px; }
 .view-tabs button span { font-size: 9px; }
 .viewport-tools { position: absolute; right: 12px; top: 72px; z-index: 3; }
 .viewport-tools button { width: 29px; height: 29px; background: #0b0e0de8; }
 .drawing-label { left: 12px; top: 18px; font-size: 7px; gap: 7px; }
 .drawing-label small { font-size: 6px; }
 .view-presets { top: auto; bottom: 16px; right: 12px; }
 .view-presets button { padding: 8px; font-size: 7px; }
 .axis-indicator { bottom: 20px; left: 22px; right: auto; width: 24px; height: 24px; font-size: 6px; }
 .drawing-status { padding: 12px; gap: 10px; font-size: 6px; }
 .drawing-status > span { display: none; }
 #model-hint { font-size: 6px; }
 .sequence-controls { padding: 10px 12px; }
 .sequence-heading { font-size: 6px; }
 .sequence-heading button { font-size: 8px; }
 .phase-buttons button { font-size: 7px; min-height: 34px; }
 .phase-slider-label { font-size: 6px; gap: 12px; }
 .intro, .service-teaser { grid-template-columns: 1fr; gap: 25px; }
 .intro-copy { margin-top: 25px; }
 .intro-copy p { font-size: 13px; }
 .section-head { display: block; margin-bottom: 30px; }
 .section-head > .under-link { width: 190px; margin-top: 20px; }
 .section-head > p { margin-top: 20px; font-size: 8px; }
 .home-project-grid, .collection-grid { grid-template-columns: 1fr; gap: 35px; }
 .project-image, .card-large .project-image, .collection-grid > :first-child .project-image { height: 340px; }
 .card-meta h3 { font-size: 28px; }
 .card-meta > span { font-size: 8px; }
 .floating-info { left: 15px; top: 15px; width: calc(100% - 30px); max-height: calc(100% - 30px); padding: 19px; }
 .floating-info h3 { font-size: 34px; }
 .floating-info > p:not(.eyebrow) { font-size: 11px; }
 .floating-info li { font-size: 7px; }
 .preview-link { font-size: 9px; }
 .project-info-toggle { bottom: 14px; right: 14px; font-size: 8px; }
 .image-interlude { min-height: 0; height: 530px; }
 .image-interlude h2 { font-size: 52px; }
 .image-interlude .under-link { width: 250px; font-size: 9px; }
 .service-teaser h2 { font-size: 35px; }
 .service-teaser > div > a { padding: 22px 0; }
 .next-chapter { padding: 30px 5%; gap: 20px; }
 .next-chapter > .eyebrow { max-width: 110px; font-size: 7px; }
 .next-chapter > a { font-size: 38px; gap: 25px; }
 .next-chapter > a span { font-size: 22px; }
 footer { padding: 35px 5% 22px; }
 .footer-info { grid-template-columns: 1fr; gap: 23px; }
 .footer-info > div { margin-left: 0; flex-direction: row; gap: 25px; font-size: 8px; }
 .footer-base { margin-top: 30px; font-size: 7px; gap: 20px; }
 .footer-base > span:nth-child(2) { display: none; }
 .page-heading { padding-top: 50px; padding-bottom: 35px; }
 .page-heading h1 { margin-top: 20px; }
 .heading-bottom { display: block; margin-top: 25px; }
 .heading-bottom p { font-size: 13px; }
 .heading-bottom > span { display: block; margin-top: 20px; font-size: 7px; }
 .heading-bottom > .under-link { max-width: 210px; margin-top: 20px; }
 .projects-collection { padding-top: 30px; }
 .category-nav { gap: 16px 20px; margin-bottom: 30px; }
 .category-nav a { font-size: 8px; padding-bottom: 12px; }
 .source-note { font-size: 8px; }
 .project-hero { height: 65svh; min-height: 430px; }
 .project-hero-copy h1 { font-size: 70px; }
 .project-hero-copy p { font-size: 8px; }
 .project-story { grid-template-columns: 1fr; gap: 30px; }
 .project-facts { max-width: none; margin-top: 20px; }
 .body-large { font-size: 18px; margin-top: 25px; }
 .body-copy { font-size: 13px; }
 .material-tags span { font-size: 7px; }
 .comparison { aspect-ratio: 4/3; }
 .comparison-label { top: 10px; font-size: 7px; padding: 7px 9px; }
 .comparison-label.left { left: 10px; }
 .comparison-label.right { right: 10px; }
 .comparison-divider::before { width: 32px; height: 32px; }
 .gallery-grid { grid-template-columns: 1fr; gap: 25px; }
 .gallery-frame:first-child, .gallery-frame:nth-child(7n) { grid-column: auto; }
 .gallery-frame.portrait { width: 70%; }
 .gallery-frame > span:not(.gallery-hover) { font-size: 8px; }
 .gallery-frame > .gallery-hover { font-size: 8px; padding: 9px 12px; top: 12px; left: 12px; }
 .preview-next .project-image { height: 350px; }
 .service-panels { grid-template-columns: 1fr; gap: 35px; padding-top: 40px; }
 .service-panels .project-image { height: 390px; }
 .service-detail-hero { grid-template-columns: 1fr; min-height: 0; }
 .service-detail-hero > div { padding: 50px 5%; }
 .service-detail-hero h1 { font-size: 65px; margin: 25px 0; }
 .service-detail-hero > img { height: 400px; border-left: 0; border-top: 1px solid var(--line); }
 .scope-list { margin-top: 30px; }
 .scope-list h3 { font-size: 28px; }
 .related-project .project-image { height: 340px; }
 .approach-intro { grid-template-columns: 1fr; padding: 50px 5%; gap: 35px; }
 .approach-intro .cad-workbench { height: 550px; order: 2; }
 .approach-intro > div:last-child { order: 1; }
 .approach-intro > div:last-child > p { font-size: 13px; margin-top: 25px; }
 .process-stages > article { grid-template-columns: 55px 1fr; gap: 20px; padding: 35px 0; }
 .step-index { font-size: 60px; }
 .process-stages h3 { font-size: 11px; line-height: 1.7; margin-top: 20px; }
 .process-stages p { font-size: 13px; }
 .studio-banner { height: 450px; min-height: 0; }
 .studio-banner p { right: 5%; font-size: 6px; }
 .lead-architect { grid-template-columns: 1fr; gap: 35px; }
 .architect-photo { height: auto; aspect-ratio: 1086/1221; }
 .architect-photo figcaption { left: 14px; right: 14px; bottom: 14px; font-size: 7px; }
 .lead-architect h2 { font-size: 72px; }
 .studio-values { grid-template-columns: 1fr; gap: 35px; }
 .studio-values > div { border-top: 1px solid var(--line); padding-top: 20px; }
 .studio-values h2 { font-size: 48px; }
 .studio-values p { max-width: none; margin-top: 15px; font-size: 13px; }
 .contact-page { grid-template-columns: 1fr; gap: 45px; }
 .contact-page h1 { font-size: 75px; margin-top: 25px; }
 .contact-page .body-large { font-size: 18px; }
 .contact-help { margin-top: 35px; max-width: none; }
 .contact-help h2 { font-size: 34px; }
 .contact-help .source-note { font-size: 8px; }
 .form-row { grid-template-columns: 1fr; gap: 0; }
 .radio-option { font-size: 8px; padding: 10px; }
 legend { font-size: 10px; }
 summary { font-size: 15px; padding: 22px 0; }
 details p { font-size: 12px; }
 .policy h1 { font-size: 60px; }
 .policy h2 { font-size: 31px; }
 dialog { width: 100vw; height: 90svh; padding: 14px; }
 .lightbox-bar, .lightbox-bar button { font-size: 8px; }
}
@media (prefers-reduced-motion:reduce) {
 html { scroll-behavior: auto; }
 *, *::before, *::after { transition: none !important; animation: none !important; }
 .reveal { opacity: 1; transform: none; }
 .transition-panel { display: none; }
}
@view-transition { navigation: auto; }
::view-transition-old(root) { animation: cad-out .18s ease both; }
::view-transition-new(root) { animation: cad-in .35s ease both; }
@keyframes cad-out { to { opacity: 0; } }
@keyframes cad-in { from { opacity: 0; transform: translateY(8px); } to { opacity: 1; transform: none; } }
@media(max-width:760px){
 .cad-hero-copy { padding: 24px 5% 20px; }
 .cad-hero-copy h1 { font-size: 64px; margin: 18px 0; }
 .drawing-link { margin-top: 10px; padding: 8px 0; }
 .cad-home .cad-workbench { height: 460px; }
 .viewport-tools button { width: 32px; height: 32px; }
 .phase-buttons button { min-height: 40px; }
}
@media(min-width:761px){.cad-home{min-height:620px}.site-header nav a{font-size:11px}}
@media(max-width:760px){
 .phase-buttons button{font-size:9px}
 .sequence-heading{font-size:8px}
 .sequence-heading button{font-size:9px}
 .drawing-status{font-size:7px}
 form>label,.form-row>label{font-size:10px}
 input:not([type=radio]):not([type=range]),textarea{font-size:16px}
 .radio-option{font-size:10px}
}

/* Warm ivory, charcoal and olive palette. */
:root {
 --paper: #eeede7;
 --ink: #252820;
 --muted: #74766b;
 --line: #cecec3;
 --accent: #777c56;
 --dark: #141712;
}
body {
 background-image: linear-gradient(#858e710b 1px, transparent 1px), linear-gradient(90deg, #858e710b 1px, transparent 1px), linear-gradient(#858e7106 1px, transparent 1px), linear-gradient(90deg, #858e7106 1px, transparent 1px);
}
.site-header { background: #eeede7ed; }
.brand img { filter: none; }
#mobile-menu { background: #eeede7; }
.cad-home, .cad-workbench, .cad-home-page .site-header, footer, dialog, .service-detail-hero > div {
 --paper: #141712;
 --ink: #eeede7;
 --muted: #a6ad9b;
 --line: #34392e;
 --accent: #bdc5a6;
 color: var(--ink);
 background-color: #141712;
}
.cad-home {
 background-image: linear-gradient(#c1c8ac07 1px, transparent 1px), linear-gradient(90deg, #c1c8ac07 1px, transparent 1px);
 background-size: 160px 160px;
}
.cad-home-page .site-header .brand img, footer .brand img { filter: invert(1); }
.cad-home-page .site-header { background: #141712; }
.cad-home-page #mobile-menu { background: #141712; color: #eeede7; --line: #34392e; }
.cad-toolbar { background: #1d2318b5; }
.view-tabs button.selected { border-color: #7d896a; background: #343e2b; color: #d2d7bf; }
.viewport-tools button:hover { background: #343e2b; }
.drawing-surface {
 background-image: linear-gradient(#b5bd9b0c 1px, transparent 1px), linear-gradient(90deg, #b5bd9b0c 1px, transparent 1px);
}
.drawing-label { color: #b8c0a4; }
.drawing-label small { color: #8b947c; }
.drawing-marker { border-color: #a6ad85; }
.view-presets button { color: #a6ad9b; border-color: #48503d; background: #141712e8; }
.view-presets button.selected { color: #d2d7bf; border-color: #a6ad85; }
.drawing-status { color: #929c83; }
#drawing-mode-label { color: #bdc5a6; }
.hero-footnote { color: #929c83; }
.sequence-controls { background: #1a2117; }
.phase-buttons button { border-color: #48503d; color: #929c83; }
.phase-buttons button.selected, .phase-buttons button.completed { border-color: #bdc5a6; color: #d2d7bf; }
#phase-slider { accent-color: #a6ad85; }
.project-image, .gallery-frame > img, .architect-photo { border-color: #c3c8b6; }
.project-info-toggle { border-color: #bfc4b2; background: #eeede7ed; color: #252820; }
.floating-info {
 --ink: #252820;
 --muted: #74766b;
 --line: #cecec3;
 --accent: #777c56;
 background: #eeede7f5;
 color: #252820;
 border-color: #c3c8b6;
 box-shadow: 0 14px 55px #17201033;
 scrollbar-color: #a6ad85 #eeede7;
}
.floating-info > .eyebrow { color: #747b61; }
.floating-info > p:not(.eyebrow) { color: #626857; }
.floating-info li { color: #747b67; }
.floating-info ul, .preview-link { border-color: #cecec3; }
.preview-close { background: #eeede7; color: #74766b; }
.image-interlude em { color: #d2d7bf; }
.image-interlude .eyebrow { color: #d8decf; }
.image-interlude .under-link { border-color: #c3c8b699; }
.next-chapter { background: #daddcd; border-color: #bfc3ae; }
.footer-base { color: #a6ad9b; }
.heading-bottom > span, .source-note { color: #74766b; }
.project-hero { color: #eeede7; }
.project-hero .eyebrow { color: #d8decf; }
.project-hero-copy p { color: #d2d7bf; }
.body-large { color: #626857; }
.material-tags span { border-color: #bfc4b2; color: #747b61; }
.comparison-section { background: #e5e6dd; }
.comparison { border-color: #bfc4b2; }
.comparison-label { background: #eeede7ed; color: #252820; }
.gallery-frame > .gallery-hover { background: #eeede7ed; color: #252820; border-color: #bfc4b2; }
.preview-next { background: #e0e3d5; }
.step-index { color: #a7ab98; }
.studio-banner p, .architect-photo figcaption { background: #eeede7ed; color: #252820; border-color: #bfc4b2; }
.studio-values { background: #e2e5d8; }
.radio-option { border-color: #c3c8b6; }
.radio-option:has(input:checked) { border-color: #252820; background: #252820; color: #eeede7; }
.radio-option input { accent-color: #819352; }
form > label, .form-row > label { color: #626857; }
input:not([type=radio]):not([type=range]), textarea { border-color: #bfc4b2; }
::placeholder { color: #919584; }
.solid-button { background: #252820; color: #eeede7; }
dialog { border-color: #647054; }
dialog::backdrop { background: #141712ed; }
.transition-panel { background: #273020; }
.transition-panel span { color: #dde3cf; }
@media(max-width:760px) {
 .viewport-tools button { background: #141712ed; }
}

/* A single ivory and olive theme across every page and drawing view. */
:root, .cad-home, .cad-workbench, .cad-home-page .site-header,
footer, dialog, .service-detail-hero > div {
 --paper: #eeede7;
 --ink: #252820;
 --muted: #74766b;
 --line: #cecec3;
 --accent: #777c56;
 --dark: #141712;
 color: #252820;
 background-color: #eeede7;
}
.cad-home, .drawing-surface {
 background-image: linear-gradient(#858e7110 1px, transparent 1px), linear-gradient(90deg, #858e7110 1px, transparent 1px);
}
.cad-home-page .site-header .brand img, footer .brand img { filter: none; }
.cad-home-page #mobile-menu { background: #eeede7; color: #252820; --line: #cecec3; }
.cad-toolbar { background: #e5e7dd; }
.view-tabs button.selected { border-color: #8d967c; background: #daddcd; color: #343c2b; }
.viewport-tools button, .viewport-tools button:hover { background: #eeede7; border-color: #bfc4b2; color: #343c2b; }
.drawing-label, #drawing-mode-label { color: #626d55; }
.drawing-label small, .drawing-status, .hero-footnote { color: #747b67; }
.drawing-marker { border-color: #777c56; }
.view-presets button { background: #eeede7e8; color: #74766b; border-color: #bfc4b2; }
.view-presets button.selected { color: #343c2b; border-color: #777c56; background: #daddcd; }
.axis-indicator { border-color: #8b957c; color: #626d55; }
.sequence-controls { background: #e5e7dd; }
.phase-buttons button { border-color: #bfc4b2; color: #74766b; }
.phase-buttons button.selected, .phase-buttons button.completed { border-color: #777c56; color: #343c2b; }
.footer-base { color: #74766b; }
.transition-panel { background: #daddcd; }
.transition-panel span { color: #343c2b; }
dialog::backdrop { background: #252820b8; }
@media(max-width:760px){.viewport-tools button{background:#eeede7ed}}

/* Readable Carlito typography, locally hosted in regular and bold. */
@font-face {font-family:Carlito;src:url('/assets/fonts/Carlito-Regular.ttf') format('truetype');font-weight:400;font-display:swap}
@font-face {font-family:Carlito;src:url('/assets/fonts/Carlito-Bold.ttf') format('truetype');font-weight:600 900;font-display:swap}
:root {--sans:Carlito,Calibri,'Segoe UI',Arial,sans-serif;--mono:Carlito,Calibri,'Segoe UI',Arial,sans-serif;--display:Carlito,Calibri,'Segoe UI',Arial,sans-serif}
:root,.cad-home,.cad-workbench,.cad-home-page .site-header,footer,dialog,.service-detail-hero>div,.floating-info {--ink:#24281f;--muted:#4e5547;--accent:#59643e;color:var(--ink)}
body {font-size:17px;line-height:1.65}
h1,h2,h3 {font-weight:700;letter-spacing:-.035em;line-height:1.04}
h1 {font-size:clamp(60px,7.5vw,116px)}
h2 {font-size:clamp(39px,5vw,72px)}
.site-header {height:100px;gap:24px}
.brand {gap:16px}
.brand img {width:52px;height:60px}
.brand>span {font-size:24px;font-weight:700;letter-spacing:-.025em}
.brand small {font-size:11px;font-weight:700;letter-spacing:.13em;color:#444c3b}
.site-header nav {gap:28px}
.site-header nav a {font-size:18px;font-weight:700;color:#343c2d;padding:15px 0}
.header-controls>button {width:40px;height:40px;font-size:16px;border-color:#959e87}
.cad-home {height:calc(100svh - 100px)}
.cad-hero-copy h1 {font-size:clamp(70px,7.2vw,116px);font-weight:700;line-height:.96}
.cad-hero-copy>p:not(.eyebrow) {font-size:17px;color:#444c3b}
.eyebrow,.section-label {font-size:12px;font-weight:700;color:#4e5547;letter-spacing:.09em}
.hero-footnote {font-size:10px;color:#4e5547}
.drawing-link,.under-link,.pill-link {font-size:16px;font-weight:700}
.category-nav {gap:34px}
.category-nav a {font-size:18px;font-weight:700;color:#414a36;padding-bottom:18px}
.category-nav a[aria-current=page] {color:#3d4d29;border-bottom-width:3px}
.heading-bottom>p,.body-copy,.intro-copy>p,.service-teaser>div>p,.process-stages p,.studio-values p,.approach-intro>div:last-child>p {font-size:17px;color:#454d3c}
.body-large {font-size:23px;color:#404935}
.card-meta h3 {font-size:30px;font-weight:700}
.card-meta>span,.project-facts li,.material-tags span {font-size:13px;color:#4e5547}
.project-info-toggle {font-size:13px;font-weight:700}
.floating-info {width:min(395px,calc(100% - 36px));padding:24px}
.floating-info>.eyebrow {font-size:11px;color:#465238}
.floating-info>h3 {font-size:34px;font-weight:700}
.floating-info>p:not(.eyebrow) {font-size:16px;line-height:1.6;color:#3f4936}
.floating-info li {font-size:13px;color:#46503c}
.preview-link {font-size:15px;font-weight:700}
.preview-close {color:#333e29}
.footer-info {font-size:16px}
.brand-name {font-size:26px;font-weight:700}
.footer-info>div {font-size:15px}
.footer-base,.source-note,.heading-bottom>span {font-size:12px;color:#4e5547}
.view-tabs button {font-size:17px;font-weight:700;color:#414b34;padding:9px 12px}
.view-tabs button span {font-size:14px}
.viewport-tools button {width:36px;height:36px;font-size:21px}
.drawing-label {font-size:12px;font-weight:700;color:#3c482f;top:20px}
.drawing-label small {font-size:10px;color:#4e5943}
.view-presets button {font-size:11px;font-weight:700;color:#3c482f;padding:9px}
.drawing-status {font-size:11px;color:#46533b;padding:12px 18px}
#drawing-mode-label {color:#33442a;font-weight:700}
.sequence-heading {font-size:11px}
.sequence-heading button {font-size:13px;font-weight:700;color:#33442a}
.phase-buttons button {font-size:13px;font-weight:700;color:#455337}
.phase-slider-label {font-size:12px}
form>label,.form-row>label {font-size:15px;font-weight:700;color:#3e4933}
input:not([type=radio]):not([type=range]),textarea {font-size:17px;color:#252d1e}
::placeholder {color:#5b634f;opacity:1}
legend {font-size:20px;font-weight:700}
.radio-option {font-size:16px;padding:12px 17px}
.solid-button {font-size:16px;font-weight:700}
.project-hero-copy p {font-size:15px;color:#f3f3e8}
.gallery-frame>span:not(.gallery-hover),.gallery-frame>.gallery-hover,.comparison-label {font-size:13px}
.process-stages h3 {font-size:19px}
.step-index {color:#626f50}
.architect-photo figcaption,.studio-banner p {font-size:12px;color:#303c24}
.lightbox-bar,.lightbox-bar button,.lightbox-controls {font-size:14px}
.image-interlude .eyebrow,.project-hero .eyebrow {color:#f3f3e8}
.image-interlude .under-link {color:#fff}
@media(max-width:1100px) and (min-width:761px) {
 .site-header {gap:18px;padding:0 3%}.brand>span{font-size:20px}.brand small{font-size:9px}.brand img{width:43px}.site-header nav{gap:18px}.site-header nav a{font-size:16px}
 .drawing-label{font-size:10px}.drawing-label small{font-size:9px}.view-presets{top:63px}.drawing-status{font-size:10px}
}
@media(max-width:760px) {
 .site-header{height:86px;padding:0 5%;gap:12px}.brand{gap:10px}.brand img{width:39px;height:48px}.brand>span{font-size:21px}.brand small{font-size:8px;letter-spacing:.1em;margin-top:6px}
 .header-controls{gap:6px}.header-controls>button{width:35px;height:37px;font-size:14px}.header-controls .menu-toggle{width:auto;min-width:62px;font-size:14px;padding:0 7px}#mobile-menu{top:86px}#mobile-menu a{font-size:28px;font-weight:700}
 .cad-home{height:auto}.cad-hero-copy h1{font-size:64px}.cad-hero-copy>p:not(.eyebrow){font-size:16px}.hero-footnote{font-size:10px}
 .cad-toolbar{padding:10px;gap:8px;flex-wrap:wrap}.view-tabs{gap:2px}.view-tabs button{font-size:16px;padding:8px;gap:5px}.view-tabs button span{font-size:12px}.viewport-tools{gap:4px}.viewport-tools button{width:30px;height:32px;font-size:18px}
 .drawing-label{font-size:10px;left:12px;top:14px}.drawing-label small{font-size:9px}.view-presets{top:57px;right:12px}.view-presets button{font-size:10px;padding:7px}.drawing-status{font-size:10px;padding:11px 12px;gap:12px;flex-wrap:wrap}.drawing-status>span{display:none}
 .drawing-surface{min-height:400px}.cad-home .cad-workbench{height:510px}.cad-home .cad-workbench:has(.sequence-controls:not([hidden])){height:665px}.approach-intro .cad-workbench{height:610px}
 .category-nav{gap:12px 22px}.category-nav a{font-size:16px;padding-bottom:12px}.eyebrow,.section-label{font-size:11px}
 .heading-bottom p,.body-copy,.intro-copy>p,.process-stages p,.studio-values p,.approach-intro>div:last-child>p{font-size:16px}.body-large{font-size:20px}.floating-info>p:not(.eyebrow){font-size:15px}.floating-info{padding:20px}.floating-info li{font-size:12px}.floating-info>h3{font-size:30px}
 .source-note,.footer-base{font-size:12px}.footer-info>div{font-size:14px}.body-large{line-height:1.65}.project-facts li{font-size:13px}.contact-page h1{font-size:64px}.service-detail-hero h1{font-size:52px}.project-hero-copy h1{font-size:64px}.radio-option{font-size:15px;padding:12px 14px}.process-stages h3{font-size:17px}.architect-photo figcaption{font-size:11px}.phase-buttons button{font-size:12px}.phase-slider-label{font-size:11px}
}
.cad-hero-copy .eyebrow {font-size:12px}
.next-chapter>.eyebrow,.contact-help .source-note,.section-head>p {font-size:12px;color:#46503b}
.scope-list p,.policy p,details p {font-size:16px;color:#454d3c}
#model-hint {font-size:11px}
@media(max-width:760px){.cad-hero-copy .eyebrow{font-size:11px}.image-interlude .under-link{font-size:15px}#model-hint{font-size:10px}}
.service-detail-hero p:not(.eyebrow),.contact-help p {font-size:17px;color:#454d3c}
form .source-note {font-size:12px}
@media(max-width:760px){.view-presets{bottom:auto}.service-detail-hero p:not(.eyebrow),.contact-help p{font-size:16px}}
@media(max-width:380px){.brand>span{font-size:18px}.brand img{width:32px}.brand{gap:8px}.brand small{font-size:7px}.site-header{gap:8px}.header-controls>button{width:30px}.header-controls .menu-toggle{min-width:56px;padding:0 3px;gap:6px}}

/* Quiet architectural films replace the homepage drawing workbench. */
.architectural-film {margin:0;position:relative;overflow:hidden;isolation:isolate;background:#e9e7df;border:1px solid var(--line);min-width:0}
.home-film {height:100%;border-width:0 0 0 1px}
.architectural-film video {display:block;width:100%;height:100%;object-fit:cover}
.architectural-film figcaption {position:absolute;inset:auto 0 0;display:flex;align-items:center;justify-content:space-between;gap:20px;padding:20px 25px;background:linear-gradient(transparent,#eeede7e8 70%);font-size:13px;font-weight:700;color:#36412d;pointer-events:none}
.architectural-film figcaption span:first-child {font-size:11px;letter-spacing:.11em}
.interior-film-section {display:grid;grid-template-columns:35% 65%;padding-block:95px;gap:0;border-bottom:1px solid var(--line)}
.film-introduction {padding:45px 13% 45px 0;align-self:center}
.film-introduction h2 {font-size:clamp(38px,4.4vw,65px);margin:25px 0}
.film-introduction>p:not(.eyebrow) {font-size:17px;color:var(--muted);margin-bottom:25px;max-width:340px}
.interior-film {aspect-ratio:4/3;border-color:#cecec3}
@media(max-width:760px){.home-film{height:auto;aspect-ratio:1/1;border-width:1px 0}.cad-home{display:block}.architectural-film figcaption{padding:18px 16px;gap:12px;font-size:11px}.architectural-film figcaption span:first-child{font-size:9px}.interior-film-section{grid-template-columns:1fr;padding:55px 5%;gap:28px}.film-introduction{padding:0}.film-introduction h2{font-size:43px}.film-introduction>p:not(.eyebrow){max-width:none;font-size:16px}.interior-film{aspect-ratio:1/1}}
.home-film video {object-fit:contain}
.approach-intro>.home-film {height:auto;aspect-ratio:4/3;border:1px solid var(--line)}
@media(max-width:760px){.home-film,.interior-film{aspect-ratio:4/3}.architectural-film video{object-fit:contain}.approach-intro>.home-film{order:2}}
/* Keep the complete header lockup intact in every footer column. */
.footer-info > .brand { align-self:start; min-width:max-content; }
.footer-info > .brand > span { white-space:nowrap; }

.category-collection{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.category-image{height:430px;overflow:hidden;border:1px solid var(--line)}.category-image img{transition:transform .7s}.category-card:hover img{transform:scale(1.035)}.category-caption{display:grid;grid-template-columns:30px 1fr 25px;gap:12px;align-items:center;padding:22px 0;border-bottom:1px solid var(--line)}.category-caption h2{font-size:30px}.category-caption>span:last-child{font-size:27px}.category-card>p{font-size:16px;color:var(--muted);margin-top:15px}.category-card:focus-visible{outline:2px solid var(--accent);outline-offset:6px}@media(max-width:1000px){.category-image{height:330px}.category-caption h2{font-size:25px}.category-caption{grid-template-columns:20px 1fr 20px;gap:7px}}@media(max-width:760px){.category-collection{grid-template-columns:1fr;gap:40px}.category-image{height:390px}.category-caption h2{font-size:30px}}

/* NIRA LAYOUT · 2026-11-14 */
.footer-info{grid-template-columns:minmax(280px,1.05fr) minmax(280px,1fr) minmax(180px,.65fr);gap:clamp(28px,4vw,72px);align-items:start}
.footer-info>p{margin:0;max-width:400px;font-size:16px;line-height:1.75;padding-top:1px;text-wrap:pretty}
.footer-info>div{margin:0;justify-self:end;align-self:start;display:grid;gap:12px;font-family:var(--sans);font-size:16px;line-height:1.75;min-width:180px}
.footer-info>div>a{display:flex;align-items:center;justify-content:space-between;gap:24px;min-height:28px;padding:0 0 8px;border-bottom:1px solid var(--line);white-space:nowrap}
.cad-hero-copy .drawing-link{width:max-content;max-width:100%;display:inline-flex;align-items:center;gap:32px;margin:32px 0 0;padding:15px 18px 15px 22px;border:1px solid var(--accent);background:var(--ink);color:var(--paper,#eeede7);font-family:var(--sans);font-size:17px;font-weight:600;line-height:1.2;text-decoration:none;transition:background .25s,color .25s,transform .25s}
.cad-hero-copy .drawing-link>span{width:32px;height:32px;display:grid;place-items:center;border-left:1px solid #eeede744;padding-left:12px;font-size:25px;line-height:1;transition:transform .25s}
.cad-hero-copy .drawing-link:hover{background:var(--accent);transform:translateY(-2px)}
.cad-hero-copy .drawing-link:hover>span{transform:translate(2px,-2px)}
.cad-hero-copy .drawing-link:focus-visible{outline:2px solid var(--accent);outline-offset:5px}
.cad-hero-copy .hero-footnote{display:block;position:static;left:auto;right:auto;bottom:auto;margin:18px 0 0;padding:0;border:0;max-width:300px;line-height:1.7;font-size:10px;font-weight:500;letter-spacing:.07em;color:var(--muted)}
@media(max-width:1100px){.footer-info{grid-template-columns:1fr 1fr;gap:28px 45px}.footer-info>.brand{grid-column:1/-1}.footer-info>div{justify-self:end}.footer-info>p{max-width:440px}}
@media(max-width:600px){.footer-info{grid-template-columns:1fr;gap:28px}.footer-info>p{font-size:15px;max-width:330px}.footer-info>div{justify-self:stretch;grid-template-columns:1fr;gap:12px;max-width:330px;font-size:15px}.footer-info>.brand{min-width:0}.footer-info>.brand>span{white-space:normal}.cad-hero-copy .drawing-link{margin-top:24px;padding:12px 16px 12px 20px;gap:25px;font-size:16px}.cad-hero-copy .hero-footnote{margin-top:14px;font-size:9px;max-width:100%}}
@media(prefers-reduced-motion:reduce){.cad-hero-copy .drawing-link,.cad-hero-copy .drawing-link>span{transition:none}}

/* NIRA CTA FIT · 2026-11-14 */
.cad-hero-copy .drawing-link{gap:20px;padding:15px 16px;white-space:nowrap}
@media(max-width:600px){.cad-hero-copy .drawing-link{padding:12px 16px;gap:20px}}

/* NIRA FOOTER & SERVICES · 2026-11-14 */
.service-teaser>.eyebrow{font-family:var(--sans);font-size:clamp(22px,2.2vw,30px);font-weight:700;letter-spacing:.03em;line-height:1.3;color:var(--ink);padding-top:10px}
footer{padding-top:56px;padding-bottom:28px}
.footer-info{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.62fr);gap:70px;align-items:start}
.footer-info>.footer-studio{display:block;margin:0;min-width:0;justify-self:start;font-family:var(--sans)}
.footer-info>.footer-studio>.brand{margin-bottom:24px;border:0;padding:0;justify-content:flex-start;gap:18px;min-height:0}
.footer-studio>p{margin:0;max-width:490px;font-family:var(--sans);font-size:18px;line-height:1.65;color:var(--muted);text-wrap:pretty}
.footer-links{display:grid;gap:0;width:100%;margin:0;border-top:1px solid var(--line)}
.footer-links>a{display:flex;justify-content:space-between;align-items:center;gap:20px;min-height:68px;padding:18px 0;border-bottom:1px solid var(--line);font-family:var(--sans);font-size:22px;line-height:1.3;font-weight:500;color:var(--ink)}
.footer-links>a>span{font-size:26px;color:var(--accent)}
.footer-links>a:hover{color:var(--accent)}
.footer-base{margin-top:40px}
@media(max-width:1100px){.footer-info{grid-template-columns:minmax(0,1fr) minmax(230px,.7fr);gap:40px}.footer-studio>p{font-size:17px}.footer-links>a{font-size:20px}}
@media(max-width:700px){footer{padding-top:36px}.footer-info{grid-template-columns:1fr;gap:30px}.footer-info>.footer-studio{max-width:100%;min-width:0}.footer-studio .brand{margin-bottom:20px}.footer-studio>p{font-size:17px;max-width:100%}.footer-links{max-width:none}.footer-links>a{font-size:20px;min-height:60px;padding:16px 0}.footer-base{margin-top:30px}.service-teaser>.eyebrow{font-size:24px;padding-top:0}}

/* NIRA SECTION HEADING SYSTEM · 2026-11-14 */
.eyebrow,.section-label,.service-teaser>.eyebrow,.policy .eyebrow{font-family:var(--sans);font-size:clamp(24px,2.2vw,30px);font-weight:700;line-height:1.35;letter-spacing:.03em;color:var(--ink);text-wrap:balance}
.cad-hero-copy .eyebrow{font-size:20px;line-height:1.4}
.floating-info>.eyebrow{font-size:18px;line-height:1.4;letter-spacing:.02em;color:var(--ink);padding-right:24px}
.image-interlude .eyebrow,.project-hero .eyebrow{color:#fff}
.project-hero a.eyebrow{font-size:18px;line-height:1.5}
.next-chapter>.eyebrow{max-width:340px;font-size:24px;line-height:1.4;color:var(--ink)}
.header-controls:empty{display:none}
@media(max-width:760px){.eyebrow,.section-label,.service-teaser>.eyebrow,.policy .eyebrow{font-size:24px;line-height:1.4}.cad-hero-copy .eyebrow{font-size:18px}.floating-info>.eyebrow,.project-hero a.eyebrow{font-size:17px}.next-chapter>.eyebrow{max-width:160px;font-size:20px}.next-chapter{gap:20px}.next-chapter>a{gap:20px}}
@media(max-width:420px){.next-chapter{align-items:flex-start;flex-direction:column}.next-chapter>.eyebrow{max-width:100%}.next-chapter>a{width:100%;justify-content:space-between}}