:root{
  --bg:#e9e9e7;
  --ink:#312e2e;
  --footer:#342e2e;
  --max:1810px;
  --side:38px;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--bg);
  color:var(--ink);
  font-family:Arial,Helvetica,sans-serif;
  font-weight:400;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility;
}
a{color:inherit;text-decoration:none}
.page-shell{width:min(calc(100% - (var(--side) * 2)),var(--max));margin-inline:auto}

/* header */
.site-header{height:83px;background:var(--bg)}
.header-inner{
  height:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
}
.brand{
  font-size:30px;
  line-height:1;
  letter-spacing:-1.35px;
}
.main-nav{
  display:flex;
  align-items:center;
  gap:37px;
  font-size:15px;
}
.main-nav a{
  padding:4px 0;
  border-bottom:1px solid transparent;
}
.main-nav a:hover{border-bottom-color:currentColor}

/* project */
.project{padding:32px 0 0}
.project h1{
  margin:0 0 46px;
  font-size:52px;
  line-height:1;
  font-weight:400;
  letter-spacing:-2.3px;
}
.gallery{
  display:grid;
  gap:20px;
}
.gallery-frame{
  margin:0;
  width:100%;
  aspect-ratio:16/9;
  overflow:hidden;
  background:#ddd;
}
.gallery-frame img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}
.gallery-frame.living img{object-position:50% 48%}
.gallery-frame.bathroom img{object-position:50% 51%}

.project-nav{
  margin-top:30px;
  padding:34px 0 40px;
  border-top:1px solid rgba(49,46,46,.18);
  display:flex;
  justify-content:space-between;
  gap:40px;
  font-size:20px;
  line-height:1.2;
}
.project-nav a{
  display:inline-flex;
  align-items:center;
  gap:10px;
}
.project-nav .next{margin-left:auto;text-align:right}

/* footer — kept as working footer; we'll refine globally later */
.site-footer{background:var(--footer);color:#fff}
.footer-inner{
  width:calc(100% - 152px);
  margin:0 auto;
  min-height:340px;
  padding:78px 0 52px;
  display:grid;
  grid-template-columns:1fr auto;
  grid-template-rows:auto 1fr auto;
  grid-template-areas:
    "brand links"
    ". ."
    "copyright privacy";
}
.footer-brand{grid-area:brand}
.footer-brand img{display:block;width:166px;height:auto}
.footer-brand p{margin:28px 0 0;font-size:13px;font-weight:600}
.footer-links{
  grid-area:links;
  justify-self:end;
  display:flex;
  flex-direction:column;
  gap:26px;
  align-items:flex-end;
  font-size:15px;
}
.footer-links a,.privacy{
  text-decoration:underline;
  text-underline-offset:3px;
}
.footer-inner small{grid-area:copyright;align-self:end;font-size:13px}
.privacy{grid-area:privacy;justify-self:end;align-self:end;font-size:13px}

/* Mobile pass later; this is only a safe fallback for now */
@media (max-width:900px){
  :root{--side:20px}
  .site-header{height:90px}
  .main-nav{display:none}
  .project{padding-top:22px}
  .project h1{font-size:40px;margin-bottom:30px}
  .gallery{gap:14px}
  .project-nav{
    flex-direction:column;
    align-items:flex-start;
    font-size:18px;
  }
  .project-nav .next{margin-left:0;text-align:left}
  .footer-inner{
    width:calc(100% - 40px);
    display:block;
    min-height:auto;
    padding:50px 0 32px;
  }
  .footer-links{margin-top:50px;align-items:flex-start}
  .privacy{display:block;margin-top:55px}
  .footer-inner small{display:block;margin-top:24px}
}

/* About — layout based on supplied reference */
.about{padding-top:80px;padding-bottom:140px}
.about figure{margin:0}.about img{display:block;width:100%;height:auto}
.intro,.text-row,.portrait-row{display:grid;grid-template-columns:1fr 1fr;column-gap:clamp(60px,9vw,170px);align-items:start}
.about h1,.about h2{font-size:clamp(32px,2.75vw,48px);font-weight:400;line-height:1.08;letter-spacing:-1.5px;margin:0}
.about p,.cooperation-link{font-size:clamp(17px,1.35vw,22px);line-height:1.45;margin:0 0 24px}
.intro-copy{padding-top:clamp(20px,3.3vw,60px)}
.intro-copy h1{margin-bottom:70px}.intro-copy p{max-width:650px}
.intro-image{aspect-ratio:1;overflow:hidden}.intro-image img{height:100%;object-fit:cover}
.about>.text-row{margin-top:70px}.quality{margin-top:90px}.portrait-row{margin-top:75px}
.portrait-row img{aspect-ratio:3/2;object-fit:contain}.cooperation-link{text-decoration:underline;text-underline-offset:4px}
@media(max-width:900px){.about{padding-top:35px;padding-bottom:70px}.intro,.text-row,.portrait-row{grid-template-columns:1fr;gap:30px}.intro-copy{padding-top:0}.intro-copy h1{margin-bottom:35px}.about h1,.about h2{font-size:34px}.about>.text-row,.quality{margin-top:65px}.portrait-row{margin-top:35px}.about p,.cooperation-link{font-size:18px}}

.contact-layout{display:grid;grid-template-columns:1fr 1fr;gap:clamp(50px,9vw,150px);padding:70px 0 65px;align-items:start}.contact-copy{padding-top:20px}.contact-copy h1{font-size:clamp(32px,2.75vw,48px);font-weight:400;letter-spacing:-1px;margin:0 0 35px}.contact-intro{font-size:18px;line-height:1.45;margin:0 0 48px}.contact-form label{display:block;font-size:17px;margin:0 0 9px}.contact-form label span{font-size:14px;margin-left:6px}.contact-form input,.contact-form textarea{display:block;width:100%;border:1px solid transparent;background:#f8f8f8;color:var(--ink);font:inherit;font-size:18px;padding:12px 18px;border-radius:28px;margin-bottom:25px}.contact-form textarea{min-height:135px;resize:vertical;border-radius:25px}.contact-form input:focus,.contact-form textarea:focus{outline:2px solid var(--ink);outline-offset:3px}.contact-form button{border:0;border-radius:30px;background:var(--ink);color:white;font:inherit;font-size:16px;letter-spacing:.5px;padding:19px 35px;cursor:pointer}.contact-form button:hover{background:#514a48}.contact-privacy{font-size:15px;line-height:1.4;margin:58px 0 0}.contact-privacy a{text-decoration:underline;text-underline-offset:2px}.contact-image{margin:0}.contact-image img{display:block;width:100%;height:auto}.contact-status{font-size:15px;line-height:1.4}.contact-status:empty{display:none}.contact-form .honeypot{display:none}a:focus-visible,button:focus-visible{outline:2px solid currentColor;outline-offset:5px}@media(max-width:900px){.contact-layout{grid-template-columns:1fr;gap:45px;padding-top:25px}.contact-copy{padding-top:0}.contact-intro{font-size:17px;margin-bottom:32px}.contact-privacy{margin-top:35px}.contact-image{max-width:600px}}