:root{--ink:#332d29;--paper:#f3f0ea;--sand:#d8cec3;--brown:#6d5a4b;--line:rgba(51,45,41,.18)}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--paper);color:var(--ink);font-family:"DM Sans",sans-serif;font-size:16px;font-weight:300}
a{color:inherit;text-decoration:none}
.site-header{position:fixed;z-index:10;top:0;left:0;width:100%;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:24px 3.2vw 32px;color:#fff;background:linear-gradient(180deg,rgba(36,29,25,.58) 0%,rgba(36,29,25,.28) 68%,rgba(36,29,25,0) 100%);border-bottom:0;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px)}
.brand{font-family:"Italiana",serif;font-size:clamp(2rem,2.5vw,2.7rem);line-height:1;letter-spacing:.04em;text-transform:uppercase}
nav{display:flex;gap:3.35rem;font-size:1.125rem;letter-spacing:.06em}
nav a,.header-cta{transition:opacity .25s}
nav a:hover,.header-cta:hover{opacity:.62}
.header-cta{justify-self:end;font-size:1.125rem;border-bottom:1px solid currentColor;padding-bottom:3px}
.menu-toggle{display:none}
.hero{position:relative;min-height:96vh;background:linear-gradient(95deg,rgba(25,19,15,.38),rgba(25,19,15,.08)),url("assets/hero.png") 26% 14%/cover no-repeat;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;overflow:hidden}
.hero-shade{position:absolute;inset:0;background:linear-gradient(180deg,rgba(20,15,12,.1),transparent 45%,rgba(20,15,12,.35))}
.hero>*:not(.hero-shade){position:relative;z-index:1}
.hero h1{max-width:1150px;text-align:center;font-family:"Italiana",serif;font-weight:400;font-size:clamp(3.05rem,6.7vw,6.75rem);line-height:.9;letter-spacing:.01em;margin:5rem 3vw 2rem;text-transform:uppercase}
.hero-intro{max-width:760px;text-align:center;font-family:"DM Sans",sans-serif;font-size:clamp(1rem,1.45vw,1.3rem);line-height:1.45;margin:0 2rem 2.3rem;text-shadow:0 1px 18px rgba(0,0,0,.35)}
.pill{display:inline-flex;gap:2rem;align-items:center;border:1px solid var(--ink);border-radius:999px;padding:.85rem 1.25rem;font-size:.84rem;transition:background .25s,color .25s}
.pill:hover{background:var(--ink);color:var(--paper)}
.pill-light{border-color:rgba(255,255,255,.55);background:rgba(65,53,43,.45);backdrop-filter:blur(10px);justify-content:center;text-align:center}
.pill-light:hover{background:#fff;color:var(--ink)}
.manifesto{display:grid;grid-template-columns:1fr 1fr;gap:8vw;padding:7rem 5vw 5rem;border-bottom:1px solid var(--line)}
.manifesto h2,.platform h2,.favorite-projects h2,.contact h2{font-family:"Italiana",serif;font-weight:400;line-height:1.03;margin:0;font-size:clamp(2.5rem,5vw,5.3rem)}
.manifesto-copy{max-width:590px;border-left:1px solid var(--line);padding-left:3rem;font-size:1.02rem;line-height:1.65}
.manifesto-copy p:first-child{font-size:1.25rem;margin-top:0}
.services{display:grid;grid-template-columns:.8fr 1.2fr;gap:8vw;padding:7rem 5vw;background:#e7dfd5;border-bottom:1px solid var(--line)}
.services-heading{position:sticky;top:2.5rem;align-self:start}
.services-heading h2{font-family:"Italiana",serif;font-weight:400;line-height:1.03;margin:0;font-size:clamp(2.8rem,5vw,5.3rem)}
.services-list{border-top:1px solid var(--line)}
.services-list article{display:grid;grid-template-columns:3rem minmax(170px,.65fr) 1fr;gap:1.5rem;align-items:start;padding:1.8rem 0;border-bottom:1px solid var(--line)}
.services-list span{font-family:"Italiana",serif;color:#84776e;padding-top:.35rem}
.services-list h3{font-family:"Italiana",serif;font-size:clamp(1.55rem,2.4vw,2.5rem);font-weight:400;margin:0}
.services-list p{line-height:1.6;margin:.2rem 0 0;max-width:430px}
.process{display:grid;grid-template-columns:1fr 1.35fr;gap:9vw;padding:7rem 5vw;background:#f3f0ea;border-bottom:1px solid var(--line)}
.process-intro{align-self:start;max-width:570px}
.process-intro h2{font-family:"Italiana",serif;font-weight:400;line-height:1.03;margin:0 0 2rem;font-size:clamp(2.8rem,5vw,5.3rem)}
.process-intro>p:last-child{max-width:480px;line-height:1.7;font-size:1.02rem}
.process-steps{list-style:none;margin:0;padding:0;border-top:1px solid var(--line)}
.process-steps li{display:grid;grid-template-columns:4rem 1fr;gap:1.5rem;padding:2rem 0;border-bottom:1px solid var(--line)}
.process-steps .step-mark{display:flex;flex-direction:column;align-items:flex-start;gap:.7rem;color:#84776e;padding-top:.15rem}
.step-mark svg{width:2rem;height:2rem;fill:none;stroke:currentColor;stroke-width:1.35;stroke-linecap:round;stroke-linejoin:round}
.step-mark b{font-family:"Italiana",serif;font-size:.88rem;font-weight:400}
.process-steps h3{font-family:"Italiana",serif;font-size:clamp(1.65rem,2.5vw,2.65rem);font-weight:400;margin:0 0 .65rem}
.process-steps p{line-height:1.65;margin:0;max-width:600px}
.favorite-projects{padding:7rem 1.2vw 6rem;border-bottom:1px solid var(--line)}
.projects-heading{padding:0 3.8vw 1.5rem}
.cards{padding:2.4rem 0 0;display:grid;grid-template-columns:repeat(6,1fr);gap:.75rem}
.card{min-width:0;border-bottom:1px solid var(--line);padding-bottom:1.1rem}
.card-image{height:clamp(280px,32vw,490px);border-radius:32px;background-size:cover;background-position:center;filter:saturate(.7);transition:filter .35s,transform .35s}
.card:hover .card-image{filter:saturate(1);transform:translateY(-4px)}
.card-1 .card-image{background-image:url("assets/project-01.webp")}.card-2 .card-image{background-image:url("assets/apartment-interiors-stair.jpg")}.card-3 .card-image{background-image:url("assets/apartment-renovation-2.png")}.card-4 .card-image{background-image:url("assets/project-04.webp")}.card-5 .card-image{background-image:url("assets/project-05.webp")}.card-6 .card-image{background-image:url("assets/project-06.webp")}
.card p{font-size:.68rem;letter-spacing:.12em;text-transform:uppercase;margin:1rem 0 .55rem}.card h3{font-size:.84rem;font-weight:400;margin:0;min-height:2rem}.card span{display:block;margin-top:.8rem;font-family:"Italiana",serif;font-size:.8rem;color:#85786f}
.platform{background:#55463c;color:#eee8e1;padding:7rem 5vw}
.eyebrow{text-transform:uppercase;letter-spacing:.14em;font-size:.72rem;margin:0 0 2.5rem}
.platform-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:0;margin-top:5rem;border-top:1px solid rgba(255,255,255,.25)}
.platform-grid article{padding:2rem 3rem 0 0;border-right:1px solid rgba(255,255,255,.25)}
.platform-grid article+article{padding-left:3rem}.platform-grid article:last-child{border:0}
.platform-grid span{font-family:"Italiana",serif}.platform-grid h3{font-family:"Italiana",serif;font-size:2.2rem;font-weight:400;margin:2.4rem 0 1rem}.platform-grid p{line-height:1.65;max-width:360px}
.text-link{font-size:.9rem;border-bottom:1px solid;padding-bottom:.35rem}
.contact{text-align:center;padding:7rem 5vw 8rem}.contact>p{margin:0 0 1.2rem;text-transform:uppercase;letter-spacing:.12em;font-size:.72rem}.contact h2{margin-bottom:2.5rem}
footer{display:grid;grid-template-columns:1fr 1.5fr 1fr 1fr;gap:2rem;padding:2.4rem 3.2vw;border-top:1px solid var(--line);align-items:center;font-size:.78rem}
footer p{margin:0}footer a:last-child{text-align:right}
.footer-contact{display:flex;flex-direction:column;align-items:flex-end;gap:.5rem}
@media(max-width:900px){.footer-contact{align-items:flex-start}}
@media(max-width:900px){.site-header{grid-template-columns:1fr auto}.header-cta{display:none}.menu-toggle{display:block;background:none;border:1px solid rgba(255,255,255,.45);border-radius:99px;color:white;padding:.55rem .9rem}.site-header nav{display:none;position:absolute;top:78px;left:2vw;right:2vw;background:rgba(52,44,38,.96);padding:2rem;flex-direction:column;border-radius:18px}.site-header nav.open{display:flex}.hero{min-height:77svh;background-position:50% 14%}.hero h1{font-size:clamp(3rem,11vw,5rem);line-height:.92}.manifesto{grid-template-columns:1fr;padding:5rem 6vw}.manifesto-copy{padding-left:0;border-left:0}.services{grid-template-columns:1fr;padding:5rem 6vw}.services-heading{position:static}.services-list article{grid-template-columns:2.5rem 1fr}.services-list p{grid-column:2}.process{grid-template-columns:1fr;padding:5rem 6vw}.favorite-projects{padding:5rem 3vw}.projects-heading{padding:0 3vw 1.5rem}.cards{grid-template-columns:repeat(2,1fr);padding:1rem 0 0}.card-image{height:48vw}.platform-grid{grid-template-columns:1fr}.platform-grid article,.platform-grid article+article{padding:2rem 0;border-right:0;border-bottom:1px solid rgba(255,255,255,.25)}footer{grid-template-columns:1fr 1fr}footer a:last-child{text-align:left}}
@media(max-width:520px){.brand{font-size:1.85rem}.hero{min-height:75svh}.hero h1{font-size:clamp(2.55rem,12vw,3.85rem)}.hero-intro{text-align:center;padding:0 2rem}.cards{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:1rem}.card{flex:0 0 72vw;scroll-snap-align:start}.card-image{height:92vw}.manifesto,.platform,.contact{padding-left:6vw;padding-right:6vw}footer{grid-template-columns:1fr}}
/* Center the skylight (46.8% across the source image) beneath desktop navigation.
   The slight overscan keeps the photograph covering both edges after shifting. */
@media(min-width:901px){.hero{background-size:cover,max(107vw,128vh) auto;background-position:center,calc(50% + max(3.424vw,4.096vh)) 14%}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.card-image{transition:none}}

#contact{scroll-margin-top:120px}
.contact-form{display:grid;grid-template-columns:1fr 1fr;gap:1.6rem 2rem;max-width:820px;margin:3rem auto 0;text-align:left}
.form-field{display:flex;flex-direction:column;gap:.65rem;min-width:0}
.form-field label{font-size:1rem;font-weight:400}.form-field label span{font-size:.875rem;opacity:.72}
.form-field input,.form-field textarea{width:100%;border:1px solid var(--line);border-radius:4px;background:rgba(255,255,255,.45);color:var(--ink);font:inherit;font-size:1rem;padding:.95rem 1rem;line-height:1.5}
.form-field textarea{resize:vertical;min-height:150px}.form-field input::placeholder,.form-field textarea::placeholder{color:#71675e;opacity:1}
.form-field input:focus-visible,.form-field textarea:focus-visible,.form-actions button:focus-visible{outline:2px solid var(--brown);outline-offset:3px}
.form-wide{grid-column:1/-1}.form-trap{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}
.form-actions{text-align:center}.form-actions button{font:inherit;font-size:1rem;color:var(--ink);background:transparent;cursor:pointer}.form-actions button:hover{color:var(--paper);background:var(--ink)}.form-actions button:disabled{opacity:.55;cursor:wait}
.form-status{font-size:1rem;line-height:1.5;margin:1rem 0 0}.form-status:empty{display:none}.form-status[data-error="true"]{color:#963824}
.contact>.contact-email{text-transform:none;letter-spacing:0;font-size:1rem;line-height:1.6;margin:2rem 0 0}.contact-email a{border-bottom:1px solid var(--line);overflow-wrap:anywhere}
@media(max-width:600px){.contact-form{grid-template-columns:1fr;gap:1.3rem}.contact-email a{display:block;width:fit-content;margin:auto}}