:root{
  --navy:#09212c;
  --navy2:#0d2a36;
  --cream:#f1eee7;
  --white:#fbfaf7;
  --ink:#111719;
  --muted:#697377;
  --line:rgba(255,255,255,.28);
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--navy);color:var(--white);font-family:Inter,Arial,sans-serif;font-weight:300;line-height:1.55}
a{color:inherit;text-decoration:none}
img{width:100%;display:block}
.site-header{position:absolute;z-index:20;top:0;left:0;right:0;height:105px;display:flex;align-items:center;justify-content:space-between;padding:0 5vw;background:rgba(5,25,34,.88);border-bottom:1px solid rgba(255,255,255,.08)}
.site-header.scrolled{position:fixed;background:rgba(5,25,34,.96);backdrop-filter:blur(12px)}
.brand{height:92px;width:112px;overflow:hidden;display:flex;align-items:center;justify-content:center}.brand img{width:116px;height:116px;object-fit:cover}
.nav{display:flex;align-items:center;gap:42px;font-size:10px;letter-spacing:.22em;text-transform:uppercase;font-weight:500}.nav a{padding:12px 0;opacity:.9}.nav a.active{border-bottom:1px solid #fff}.nav-cta{border:1px solid rgba(255,255,255,.65)!important;padding:14px 28px!important}.menu-toggle{display:none;background:none;border:0;color:#fff;font-size:24px}
.hero{height:min(820px,100vh);min-height:690px;position:relative;overflow:hidden;display:flex;align-items:center}.hero-photo{position:absolute;inset:0;height:100%;object-fit:cover;object-position:center 54%}.hero-overlay{position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,20,27,.92) 0%,rgba(5,20,27,.7) 28%,rgba(5,20,27,.18) 58%,rgba(5,20,27,.05) 100%)}.hero-copy{position:relative;z-index:2;width:min(620px,47vw);margin-left:4.6vw;margin-top:80px}.eyebrow{font-size:10px;letter-spacing:.34em;font-weight:500;margin:0 0 18px}.eyebrow.dark{color:#20333b}.hero h1,.section h2{font-family:"Cormorant Garamond",Georgia,serif;font-weight:400;letter-spacing:-.025em;line-height:.95;margin:0}.hero h1{font-size:clamp(68px,7.1vw,112px)}.hero-copy>p:not(.eyebrow){font-size:15px;max-width:390px;color:#d9e0e1;margin:22px 0 26px}.short-rule{width:54px;height:1px;background:#fff;margin:24px 0}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;padding:13px 20px;border:1px solid transparent;font-size:10px;letter-spacing:.18em;text-transform:uppercase;font-weight:500;transition:.25s}.button:hover{transform:translateY(-2px)}.button-outline{border-color:rgba(255,255,255,.72)}.button-light{background:var(--white);color:var(--navy)}.button-dark{border-color:#233942;color:#12272f}.hero-count{position:absolute;left:4.6vw;bottom:26px;z-index:2;font-size:8px;letter-spacing:.28em;color:#c0cbce}
.section{padding:94px 4.6vw}.light{background:var(--cream);color:var(--ink)}.dark{background:var(--navy);color:#fff}.section-top{display:grid;grid-template-columns:1.4fr .6fr;gap:8vw;align-items:end;margin-bottom:52px}.section h2{font-size:clamp(48px,5.2vw,78px)}.section-lead{font-size:13px;max-width:430px;color:#46575d;margin:0}.dark-top .section-lead{color:#bec9cc}.service-cards{display:grid;grid-template-columns:repeat(3,1fr);gap:22px}.service-card h3{font-size:10px;letter-spacing:.25em;text-transform:uppercase;margin:15px 0 7px}.service-card p{font-size:12px;color:#58666a;margin:0 0 12px;min-height:58px}.service-card a{font-size:9px;letter-spacing:.22em;text-transform:uppercase;font-weight:600}.service-card a span{font-size:18px;margin-left:14px}.image-wrap{overflow:hidden;background:#d7d2ca}.image-wrap img{height:100%;object-fit:cover;transition:transform .6s ease}.image-wrap:hover img{transform:scale(1.018)}.portrait{height:330px}.service-card:nth-child(1) .portrait img{object-position:center 54%}.service-card:nth-child(2) .portrait img{object-position:center 55%}.service-card:nth-child(3) .portrait img{object-position:center 50%}
.works{padding-top:88px}.project-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.project{height:300px}.project-card:nth-child(1) .project img{object-position:center 45%}.project-card:nth-child(2) .project img{object-position:center 50%}.project-card:nth-child(3) .project img{object-position:center 58%}.project-meta{padding:13px 3px 4px;display:flex;flex-direction:column;gap:4px}.project-meta strong{font-size:10px;letter-spacing:.2em;text-transform:uppercase}.project-meta span{font-size:11px;color:#bbc6c9}.center-action{text-align:center;margin-top:44px}
.atelier{display:grid;grid-template-columns:.92fr 1.08fr;gap:8vw;align-items:center;padding-top:100px;padding-bottom:100px}.atelier-copy{max-width:520px}.atelier-copy h2{font-size:clamp(55px,5.6vw,88px)}.dark-rule{background:#20333b}.atelier-copy>p:not(.eyebrow){font-size:13px;color:#4d5b60;max-width:470px;margin:20px 0 28px}.atelier-image{height:500px;overflow:hidden}.atelier-image img{height:100%;object-fit:cover;object-position:center 45%}
.contact{display:grid;grid-template-columns:1fr .8fr;gap:8vw;align-items:end;border-top:1px solid rgba(255,255,255,.12)}.contact h2{font-size:clamp(52px,6vw,92px)}.contact-copy{max-width:470px}.contact-copy p{color:#bdc8cb;font-size:14px;margin:0 0 26px}
footer{background:#061a23;border-top:1px solid rgba(255,255,255,.1);padding:30px 4.6vw 24px;display:grid;grid-template-columns:160px 1fr auto;align-items:center;gap:40px}.footer-brand{height:92px;width:128px;overflow:hidden}.footer-brand img{height:128px;width:128px;object-fit:cover}.footer-nav{display:flex;justify-content:center;gap:36px;font-size:8px;letter-spacing:.22em;text-transform:uppercase}.footer-small{font-size:8px;color:#8fa0a5;white-space:nowrap}
@media(max-width:980px){.site-header{height:84px}.brand{height:75px;width:95px}.brand img{width:100px;height:100px}.menu-toggle{display:block}.nav{display:none;position:absolute;top:84px;left:0;right:0;background:#071c25;padding:24px 5vw;flex-direction:column;align-items:flex-start;gap:18px}.nav.open{display:flex}.hero{min-height:720px}.hero-copy{width:72vw}.section-top{grid-template-columns:1fr;gap:22px}.service-cards,.project-grid{grid-template-columns:1fr 1fr}.service-card:last-child,.project-card:last-child{grid-column:1/-1}.portrait{height:360px}.atelier{grid-template-columns:1fr}.atelier-image{height:430px}footer{grid-template-columns:120px 1fr}.footer-small{grid-column:1/-1}.footer-nav{justify-content:flex-end}}
@media(max-width:640px){.hero{min-height:760px}.hero-photo{object-position:58% center}.hero-overlay{background:linear-gradient(90deg,rgba(5,20,27,.9),rgba(5,20,27,.35))}.hero-copy{width:86vw;margin-left:6vw}.hero h1{font-size:17vw}.section{padding:72px 6vw}.service-cards,.project-grid{grid-template-columns:1fr}.service-card:last-child,.project-card:last-child{grid-column:auto}.portrait,.project{height:330px}.section h2{font-size:13vw}.atelier-image{height:370px}.contact{grid-template-columns:1fr}.contact-copy{margin-top:16px}footer{grid-template-columns:1fr;justify-items:start}.footer-nav{justify-content:flex-start;flex-wrap:wrap;gap:16px 24px}.footer-small{white-space:normal}}

/* Refined logo integration */
.brand{height:74px;width:auto;overflow:visible;gap:13px;justify-content:flex-start;min-width:205px}
.brand-mark{position:relative;display:block;width:56px;height:63px;overflow:hidden;flex:0 0 56px}
.brand-mark img{position:absolute;width:128px;height:128px;max-width:none;object-fit:cover;left:-36px;top:-15px}
.brand-type{display:flex;flex-direction:column;line-height:1;color:#fff;transform:translateY(1px)}
.brand-type small{font-family:Inter,Arial,sans-serif;font-size:8px;font-weight:400;letter-spacing:.38em;margin:0 0 7px 1px}
.brand-type strong{font-family:"Cormorant Garamond",Georgia,serif;font-size:20px;font-weight:500;letter-spacing:.12em}
.site-header.scrolled .brand-mark{transform:scale(.92);transform-origin:left center}

.atelier{position:relative;overflow:hidden}
.atelier-watermark{position:absolute;left:-50px;bottom:-110px;width:410px;height:410px;overflow:hidden;opacity:.045;pointer-events:none}
.atelier-watermark img{width:100%;height:100%;object-fit:cover}
.atelier-copy,.atelier-image{position:relative;z-index:1}

.footer-brand{height:auto;width:auto;overflow:visible;display:flex;align-items:center;gap:13px}
.footer-mark{position:relative;display:block;width:50px;height:56px;overflow:hidden;flex:0 0 50px}
.footer-mark img{position:absolute;width:114px;height:114px;max-width:none;object-fit:cover;left:-32px;top:-13px}
.footer-type{display:flex;flex-direction:column;line-height:1}
.footer-type small{font-size:7px;letter-spacing:.35em;margin-bottom:6px}
.footer-type strong{font-family:"Cormorant Garamond",Georgia,serif;font-size:18px;font-weight:500;letter-spacing:.11em}

@media(max-width:980px){
  .brand{height:60px;min-width:170px;gap:10px}
  .brand-mark{width:46px;height:52px;flex-basis:46px}
  .brand-mark img{width:106px;height:106px;left:-30px;top:-13px}
  .brand-type small{font-size:7px;margin-bottom:5px}
  .brand-type strong{font-size:16px}
}
@media(max-width:640px){
  .brand{min-width:0}
  .brand-type strong{font-size:15px;letter-spacing:.08em}
  .brand-type small{letter-spacing:.28em}
  .atelier-watermark{width:300px;height:300px;left:-80px;bottom:-70px}
}


/* Logo visibility fix: use transparent monogram asset without clipping */
/* Featured mural first, followed by two smaller projects. */
.project-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:28px 18px}
.project-grid .project-card{grid-column:auto;min-width:0}
.project-grid .project-featured{grid-column:1/-1}
.project-grid .project{height:clamp(200px,24vw,320px)}
.project-grid .project-featured .project{height:clamp(300px,42vw,560px)}
.project-grid .project-card .project img{object-position:center 50%}
.project-grid .project-featured .project img{object-position:center 58%}
@media(max-width:640px){
  .project-grid{grid-template-columns:1fr}
  .project-grid .project{height:240px}
  .project-grid .project-featured .project{height:340px}
}
.brand-mark{width:66px;height:54px;overflow:visible;flex:0 0 66px;display:flex;align-items:center;justify-content:center}
.brand-mark img{position:static;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:center}
.footer-mark{width:62px;height:50px;overflow:visible;flex:0 0 62px;display:flex;align-items:center;justify-content:center}
.footer-mark img{position:static;width:100%;height:100%;max-width:100%;object-fit:contain;object-position:center}
.atelier-watermark{overflow:visible}
.atelier-watermark img{width:100%;height:100%;object-fit:contain;object-position:center}
@media(max-width:980px){
  .brand-mark{width:56px;height:46px;flex-basis:56px}
  .brand-mark img{width:100%;height:100%}
}
@media(max-width:640px){
  .brand-mark{width:50px;height:42px;flex-basis:50px}
}