:root{--bg:#f5f1e9;--ink:#151515;--accent:#e14d2a;--muted:#77736d;--card:#fffdf8;--line:#d9d1c5}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--ink);font-family:Arial,Helvetica,sans-serif}
a{text-decoration:none;color:inherit}.container{width:min(1220px,92%);margin:auto}
header{position:sticky;top:0;z-index:50;background:rgba(245,241,233,.94);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.nav{display:flex;justify-content:space-between;align-items:center;padding:17px 0}.brand{font-size:30px;font-weight:800;letter-spacing:-1.5px}.brand i{display:inline-block;width:9px;height:9px;background:var(--accent);margin-left:5px}
.menu{display:flex;gap:18px;align-items:center;flex-wrap:wrap}.menu a{font-size:14px;font-weight:700}.menu a:hover,.menu a.active{color:var(--accent)}
.hero{padding:80px 0 50px}.eyebrow{font-size:12px;text-transform:uppercase;letter-spacing:.16em;color:var(--accent);font-weight:800}
h1{font-size:clamp(48px,7vw,92px);line-height:.96;letter-spacing:-4px;margin:16px 0 20px;max-width:1000px}
.hero p{font-size:19px;line-height:1.65;color:var(--muted);max-width:770px}
.section{padding:42px 0 70px;border-top:1px solid var(--line)}.section-head{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:24px}
.section h2{font-size:40px;letter-spacing:-1.8px;margin:0}.section-head p{color:var(--muted);max-width:520px}
.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.grid.four{grid-template-columns:repeat(4,minmax(0,1fr))}
.card{background:var(--card);border:1px solid var(--line);border-radius:18px;overflow:hidden;transition:.2s;box-shadow:0 8px 25px rgba(0,0,0,.035)}
.card:hover{transform:translateY(-4px);border-color:var(--accent)}.media{position:relative;background:#e9e2d8;aspect-ratio:4/5;overflow:hidden}
.media.wide{aspect-ratio:16/10}.media.vertical{aspect-ratio:9/16}.media img,.media video{width:100%;height:100%;object-fit:cover;display:block}
.play{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:58px;height:58px;border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.92);font-size:20px;box-shadow:0 8px 22px rgba(0,0,0,.18)}
.card-body{padding:16px}.label{font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:var(--accent);font-weight:800}.card h3{font-size:19px;margin:8px 0 5px}.meta{font-size:13px;color:var(--muted)}
.project-block{margin:40px 0 58px}.project-title{display:flex;justify-content:space-between;align-items:end;margin-bottom:18px}.project-title h2{font-size:32px;margin:0}.actions{display:flex;gap:10px;flex-wrap:wrap}
.button{display:inline-block;padding:11px 16px;border-radius:999px;background:var(--ink);color:white;font-weight:800;font-size:13px}.button.light{background:transparent;color:var(--ink);border:1px solid var(--line)}
.lightbox{position:fixed;inset:0;background:rgba(0,0,0,.88);z-index:99;display:none;align-items:center;justify-content:center;padding:24px}.lightbox.open{display:flex}
.lightbox img{max-width:92vw;max-height:88vh;object-fit:contain}.close{position:absolute;right:25px;top:20px;color:white;font-size:34px;cursor:pointer}
footer{background:var(--ink);color:white;padding:50px 0;margin-top:30px}footer p{color:#bbb6ae}
@media(max-width:960px){.grid,.grid.four{grid-template-columns:repeat(2,1fr)}.menu{display:none}}
@media(max-width:560px){h1{letter-spacing:-2px}.grid,.grid.four{grid-template-columns:1fr}.section-head,.project-title{display:block}.section h2{font-size:33px}}